时间:2021-05-26
1、HTML模板和字符串模板
HTML模板:直接在HTML页面挂载的模板。(即非字符串模板)
非字符串模板:在单文件里用 <template></template> 指定的模板,换句话说,写在 html 中的就是非字符串模板。
字符串模板:在js字符串中定义的模板。
2、Props属性:HTML 特性是不区分大小写的。所以,当使用的不是字符串模板时,camelCase (驼峰式命名) 的 props属性需要转换为相对应的 kebab-case (短横线分隔式命名):
(1)、HTML模板:
Vue.component('child', {// 在 JavaScript 中使用 camelCaseprops: ['myMessage'],template: '<span>{{ myMessage }}</span>'})(2)、字符串模板:
<!-- 在 HTML 中使用kebab-case --><child my-message="hello!"></child>3、组件名大小写:
注意:当直接在 DOM 中使用一个组件 (而不是在字符串模板或单文件组件) 的时候,我们强烈推荐遵循 W3C 规范中的自定义组件名 (字母全小写且必须包含一个连字符)。这会帮助你避免和当前以及未来的 HTML 元素相冲突。
(1)、使用 kebab-case:
Vue.component('my-component-name', { });当使用 kebab-case (短横线分隔命名) 定义一个组件时,你也必须在引用这个自定义元素时使用 kebab-case,例如 <my-component-name>。
(2)、使用 PascalCase:
Vue.component('MyComponentName', { })当使用 PascalCase (驼峰式命名) 定义一个组件时,你在引用这个自定义元素时两种命名法都可以使用。也就是说 <my-component-name> 和 <MyComponentName> 都是可接受的。注意,尽管如此,直接在 DOM (即非字符串的模板,如:在单个组件的<template></template>中 或者 index.html中直接CDN引入vue.js的<div id="app"></div>中) 使用时只有 kebab-case 是有效的,使用驼峰式,是不会渲染的。
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
模板字符串(templatestrings)ES6中引进的一种新型的字符串字面量语法-模板字符串。书面上来解释,模板字符串是一种能在字符串文本中内嵌表示式的字符
本文实例讲述了ES6模板字符串和标签模板的应用。分享给大家供大家参考,具体如下:ES6中对字符串进行了扩展,而模板字符串就是一个非常实用的方式,可以在html中
在ES6中引入了一种新的字符串字面量—模板字符串,除了使用反引号(`)表示,它们看上去和普通的字符串没有什么区别。在最简单的情况下,他们就是普通的字符串:con
Thymeleaf主要使用org.thymeleaf.expression.Strings类处理字符串,在模板中使用#strings对象来处理字符串。开发环境:
在php中截取字符串的函数有很多,而在thinkphp中也可以直接使用php的函数,本文给大家简单的介绍thinkPHP模板中截取字符串的具体用法,希望能对各位