您的位置:首页 > 产品设计 > UI/UE

Vue的字符串模板

2017-12-05 10:38 363 查看
这两天看Vue的时候,里面提到字符串模板和非字符串模板,搞的有点儿懵圈,特地查了下,也记录下,免得后面再发生这样的事儿(记性不太好,硬伤呀。。。)

以下是教程里的原文:

HTML 特性是不区分大小写的。所以,当使用的不是字符串模板时,camelCase (驼峰式命名) 的 prop 需要转换为相对应的 kebab-case (短横线分隔式命名):
Vue.component('child', {  // 在 JavaScript 中使用 camelCase  props: ['myMessage'],  template: '<span>{{ myMessage }}</span>'})
<!-- 在 HTML 中使用 kebab-case --><child my-message="hello!"></child>
如果你使用字符串模板,则没有这些限制。

嗯,还是上面说过的,看到这里,不知道字符串模板是啥,非字符串模板是啥.....下面就来说道说道!

字符串模板:指的是在组件选项里用 template:"" 指定的模板,换句话说,写在 js 中的 template:"" 中的就是字符串模板。比如下面这个:

var tmp = new Vue({
template:"<myComponent></myComponent>"
});

非字符串模板:在单文件里用 <template></template> 指定的模板,换句话说,写在 html 中的就是非字符串模板。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  Vue 字符串模板