vuejs
关注
分享
扫一扫
lilianggui
这个作者很懒，什么都没留下…
展开
-
vue 第九天 插槽详解
1、简单插槽<slot>标签可以将父组件传过来的标签内容显示在指定位置<my-button>按钮</my-button>let myButton = { template: '<button><slot></slot></button>'};new Vue({ compo...原创 2019-11-15 09:51:35 · 153 阅读 · 0 评论 -
vue 第八天 组件传值
1、父组件传递到子组件 props<my-Component title="不做大哥好多年"></my-Component><my-component title="左边画条龙"></my-component><my-component title="右边画个彩虹"></my-component>let MyC...原创 2019-11-14 10:31:01 · 157 阅读 · 0 评论 -
vue 第七天 组件的注册和使用
1、全局注册<my-button></my-button>Vue.component('my-button', { template: '<button>我的按钮</button>'});new Vue({}).$mount('#app');2、局部注册<my-button></my-b...原创 2019-11-13 23:43:09 · 175 阅读 · 0 评论 -
vue 第六天 表单控件绑定
1、普通text类型的表单绑定<input type="text" v-model="name"><p>name: {{name}}</p>new Vue({ data(){ return { name: '' } }}).$mount('#app');2、check...原创 2019-11-12 23:46:19 · 179 阅读 · 0 评论 -
vue 第五天 事件详解
1、简单事件绑定v-on<button v-on:click="handleClick">点击</button>methods: { handleClick: function(){ alert('你点击了按钮'); }}2、内联方式，可以用来传递参数<button v-on:click="handleClic...原创 2019-11-12 20:23:54 · 162 阅读 · 0 评论 -
vue 第四天 计算属性和侦听器
1、双大括号中可以写一些简单的表达式，和语句来展示计算的结果，但是对于稍微复杂的计算，vue提供了计算属性来解决这个问题。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <...原创 2019-11-12 15:27:23 · 107 阅读 · 0 评论 -
vue 第三天 指令之条件循环v-if和v-for
上一篇说到vue的指令，指令是vue比较基础但是非常重要的知识，上篇只提到了v-bind、v-text、v-html、v-on等，这篇讨论一下编程语言不可绕开的条件和循环结构。1、v-if的作用是控制元素的显示与隐藏，v-if后面的变量或表达式为真时，元素显示，否则隐藏。与其配合使用的指令还有v-elseif、v-else，和JavaScript的条件判断原理相同。<!DOCTYP...原创 2019-11-12 14:05:58 · 531 阅读 · 0 评论 -
vue 第二天 指令
vue提供了丰富的指令，可以绑定标签的属性、事件、条件、循环等，指令通常以v-开头。1、v-bind绑定属性指令，可以绑定标签的原生属性，如class、style、id、value等，可以缩写成:属性名<!DOCTYPE html><html lang="en" xmlns:v-bind="http://www.w3.org/1999/xhtml"><h...原创 2019-11-12 13:16:30 · 263 阅读 · 0 评论 -
vue 第一天 HelloWorld
1、下载vuejs文件https://cn.vuejs.org/js/vue.js2、示例代码如下：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script ...原创 2019-11-12 11:34:17 · 131 阅读 · 0 评论 -
Vue笔记-第一天
如果没有template，会找el绑定的元素 template存在，则el绑定的元素中的内容无效 template只能有一个根节点，多个根节点时，第一个根节点以后的节点无效 v-html解释定义好的html到指定的元素中，如果目标 元素中原先就存在值，则会覆盖原来的值 v-html绑定的html中的{{}}，vue相关指令等无效 v-text不会解释html，只会原样输出 指令的值可以...原创 2019-11-09 18:07:48 · 201 阅读 · 0 评论