我有一个vuejs webpack-simple项目生成通过vue-cli。但是，我在使用时无法设置分隔符render函数来渲染我的App成分：
new Vue({
delimiters: ['[[', ']]'],
el: '#app',
render: h => h(App)
})
如果我不使用render方法，将delimiters设置正确：
new Vue({
delimiters: ['[[', ']]'],
el: '#app',
data() {
return {
// something
}
}
})
我怎样才能指定delimiters对于 Vue 组件，当使用render method?
The delimiters选项仅设置为其指定的组件的分隔符，不会影响子组件。目前，您指定根 Vue 实例应该具有delimiters set to ['[[', ']]']，然后通过App组件定义render函数不指定delimiters选项为App成分。
如果您尝试仅为 App 组件设置分隔符，那么您需要在定义该组件的任何位置执行此操作：
const App = {
template: `<div>[[ message ]]</div>`,
delimiters: ['[[',']]'],
data() {
return { message: 'Hello' }
}
}
new Vue({
el: '#app',
render: h => h(App)
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.13/vue.min.js"></script>
<div id="app"></div>
如果您想设置delimiters对于每个组件，您都可以使用全局 mixin 来做到这一点：
Vue.mixin({ delimiters: ['[[',']]'] });
const App = {
template: `<div>[[ message ]]</div>`,
data() {
return { message: 'Hello' }
}
}
new Vue({
el: '#app',
render: h => h(App)
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.13/vue.min.js"></script>
<div id="app"></div>
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
