2017-02-20 42 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', 
});