Vue интерполяция на стороне сервера не работает - PullRequest
Новая
       164

Vue интерполяция на стороне сервера не работает

0 голосов
/ 07 августа 2020

Это мое первое предприятие на стороне сервера Vue. js, и здесь я застрял. Я использую Node 12.16.3 и TypeScript. 

const Vue = require('vue');
const renderer = require('vue-server-renderer').createRenderer();

export class VueService {

  public createInstance(): Promise<string> {

    const app = new Vue({
        template: `<div>Here is {{ whatever }}</div>`
    });

    const context = {
        whatever: 'something'
    }

    return renderer.renderToString(app, context);
  }
}

Предполагается, что он вернет Here is something, но все, что я получаю, это Here is. Строка HTML выглядит следующим образом: 

<div data-server-rendered="true">Here is </div>

Я следую этому руководству: https://ssr.vuejs.org/guide/#using -a-page-template

Есть предупреждение консоль: 

[Vue warn]: Property or method "whatever" is not defined on the instance but referenced during render.
Make sure that this property is reactive, either in the data option, or for class-based components, 
by initializing the property. See: https://vuejs.org/v2/guide/reactivity.html#Declaring-Reactive-Properties.

В руководстве ничего об этом нет ... что теперь?

Конечно, если я помещу whatever: 'something' в свойство data объекта Vue объект, это работает. Но в чем тогда смысл контекста?

...