2017-02-20 39 views
1

我有一個客戶端的網站必須使用vue 1.3,並且我在使用id的字符串插值時遇到了麻煩,因爲我定義的分隔符在組件級別不起作用。Vue組件分隔符

隨着下面的代碼示例,我不斷收到一個錯誤,說我什麼都不存在。我在樹枝模板裏也使用了這段代碼。

這裏是我的代碼示例:使用反斜槓串插

Vue.config.delimiters = ['${', '}']; 

Vue.component('component-name', { 
    delimiters: ['${', '}'], 
    template: `<template>${ showSomething() }</template>`, 
    methods: { 
     showSomething: function() { 
      return 'SOMETHING'; 
     } 
    } 
}) 

new Vue({ 
     el: '#app', 
}); 

回答

2

逃生。

你可以用兩種方法做到這一點。 在$之前或之後放回斜槓。 你的情況:

template: `<template>\${ showSomething() }</template>`, 

或者

template: `<template>$\{ showSomething() }</template>`, 

app.js

Vue.config.delimiters = ['${', '}']; 

Vue.component('component-name', { 
    delimiters: ['${', '}'], 
    template: `<template>\${ showSomething() }</template>`, // 'back slash to escape string interpolation' 
    methods: { 
     showSomething: function() { 
      return 'SOMETHING'; 
     } 
    } 
}) 

new Vue({ 
     el: '#app', 
});