随笔分类 - Vue
摘要：生命周期函数就是vue实例在某一个时间点会自动执行的函数 当我们创建一个实例的时候，也就是我们调用 new Vue() 这句话的时候，vue会帮助我们去创建一个实例，创建过程其实并不像我们想的那么简单，他要经过很多的步骤 Init(Events & Lifecycle):首先他会去初始化事件和生命周
阅读全文
摘要：<div id='root'> <ul> <todo-item></todo-item> </ul> </div> <script> Vue.component('todo-item',{ template:'<li>item</li>' }) </script> 全局组件：上面这种组件叫做全局组件
阅读全文
摘要：<div id='root'> <div v-if='show'>helle world</div> <button @click='handleClick'>toggle</button> </div> <script> new Vue({ el:'#root', data:{ show:true
阅读全文
摘要：<div id='root'> 姓:<input v-model='firstName'/> 名:<input v-model='secondName'/> <div>{{fullName}}</div> <div>{{count}}</div> </div> <script> new Vue({
阅读全文
摘要：属性绑定 html <div v-bind:title="title">hello world</div> js js new Vue({ el:'#root', data:{ title:'this is hello world' } }) 所以我们注意到一个点，只要是vuejs的指令，后面的就不
阅读全文
摘要：<body> <div id='root'>{{number}}</div> <script> new Vue({ el:'#root', data:{ msg:'hello world', number:123 } }) </script> </body> 数据写法 {{number}} //这个
阅读全文
摘要：<body> <div id='root'> <h1>{{msg}}</h1> </div> <script> new Vue({ el:'#root', data:{ msg:'hello world' } }) </script> </body> 挂载点：element对应的标签 挂载点：ele
阅读全文
摘要：new Vue({ el:'#demo', data:{ message:'Hello vue.js!' } }) 我们看到这个括号里面包含了很多中间的选项，小括号里面其实是一些参数，这些参数指定了实例化vue的一些特性 第一个选项data new Vue({ data:{ a:1, b:[] }
阅读全文
摘要：推荐官方推荐的命令行工具，这套命令行工具，可用于快速搭建一个项目的模板，里面不仅包涵了最基础的vuejs框架，还包涵了vuejs打包的工具，以及测试的工具，使用他不用担心一个部署和打包的细节，可以把关注点放在vuejs本身对项目功能的实现上 //全局安装 vue-cli npm install -g
阅读全文
摘要：vuejs准备知识： 1、前端开发基础 html css js 2、前端模块化基础 3、对es6有初步的了解 vuejs是一种轻量级的MVM框架，他吸收了react和angular的优点,强调react组件化的概念，可以轻松的实现数据和展现的一个分离，也吸收了angular灵活的指令和页面操作的一些
阅读全文