摘要：
1、插槽的基本使用 在子组件内使用特殊的 <slot> 元素就可以为这个子组件开启一个 slot（插槽）； 在父组件模板里，插入在子组件标签内的所有内容将替代子组件的<slot>标签及它的内容。 子组件 Learn.vue ： <template> <div class="container"> < 阅读全文
摘要：
1、组件创建及使用 （1）在 components 目录下，新建 Learn.vue 文件，示例代码如下： <template> <!-- 只能存在一个根容器 --> <div class="container"> <p>hello world</p> </div> </template> <scr 阅读全文
摘要：
1、基本用法 Vue 提供了 v-model 指令，用于在表单类元素上双向绑定数据，例如在输入框上使用时，输入的内容会实时映射到绑定的数据上。例如下面的例子： <template> <div id="app"> <input type="text" v-model="message" placeho 阅读全文
摘要：
在数据绑定中，最常见的两个需求就是元素的样式名称 class 和 内联样式 style 的动态绑定，它们也是 html 的属性，因此可以使用 v-bind 指令。 1、绑定 class 的几种方式 （1）对象语法： 给 v-bind:class 设置一个对象，可以动态的切换 class，例如： <t 阅读全文
摘要：
1、computed 选项： <template> <div id="app"> {{ reversedText }} </div> </template> <script> export default { name: "App", data() { return { text: '123,456 阅读全文
摘要：
1、v-on 指令类似原生 Javascript 的 onclick 等写法，也是在 html 上进行监听的。例如： <template> <div id="app"> 点击次数：{{ counter }} <button @click="counter++">+1</button> </div> 阅读全文
摘要：
1、模板语法： 使用双大括号(Mustache 语法) “{{ }}” 是最基本的文本插值方法，它会自动将我们双向绑定的数据实时显示出来。例如： <template> <div id="app"> <p>{{ msg }}</p> <p>{{ 20+1 }}</p> <p>{{ "ok" ? 'ye 阅读全文