![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue
文章平均质量分 71
cxl_3619
这个作者很懒,什么都没留下…
展开
-
Vue笔记
Vue.js 是用于构建交互式的 Web 界面的库。它提供了MVVM数据绑定和一个可组合的组件系统,具有简单和灵活的API。特点:简洁,数据驱动,组件化,轻量,快速,模块友好。数据绑定、双向数据绑定。支持简单表达式<div id="app"> <p>{{ message }}</p> <input v-model="message"><原创 2018-04-26 14:10:35 · 129 阅读 · 0 评论 -
vue学习记录(一)
学习自vue官网vue:构建用户界面的渐进式框架。<!-- 开发环境版本,包含了用帮助的命令行警告 --><script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script><!-- 生产环境版本,优化了尺寸和速度 --><script src="https://cdn.j...原创 2018-04-26 14:34:15 · 159 阅读 · 0 评论 -
vue学习记录(三)
模板语法(---取值vue官方文档Vue.js 使用了基于 HTML 的模板语法,允许开发者声明式地将 DOM 绑定至底层 Vue 实例的数据。所有 Vue.js 的模板都是合法的 HTML ,所以能被遵循规范的浏览器和 HTML 解析器解析。在底层的实现上,Vue 将模板编译成虚拟 DOM 渲染函数。结合响应系统,Vue 能够智能地计算出最少需要重新渲染多少组件,并把 DOM 操作次数减到最少。...原创 2018-05-04 15:45:43 · 173 阅读 · 0 评论 -
vue学习记录(二)
说明:因为是在vue官网学习的 ,所以先按官网的进度来,一些详细的可以在官网的api文档中浏览,目前先不做整理。-------------------我知道 当数据改变时,视图会进行重新渲染。注意点:“只有当实例被创建时 data 中存在的属性才是响应式的,”(也就是说如果你添加一个新属性,那么对新属性的更改不会触发任何视图的更新。如果你晚些需要一个属性,请在一开始把他设置为空或不存在)我们还需要...原创 2018-04-27 11:36:30 · 226 阅读 · 0 评论 -
vue学习记录(四)
计算熟悉感和侦听器计算属性模板内的表达式非常的便利,是用于简单运算的。在模板中放入太多的逻辑会让模板过重且难以维护。例如:<div id="example"> {{ message.split(' ').reverse().join(' ')</div>在这个地方,模板不再是简单的声明式逻辑。你必须看一段时间才能意识到,这里是想要显示message的翻转字符串。...原创 2018-05-07 16:14:18 · 148 阅读 · 0 评论 -
vue学习记录(五)
class与style绑定操作 元素的class列表 和 内联式 是 数据绑定的 常见需求。因为都是属性,可以用 v-bind 处理 class 和 style :1,表达式计算出字符串结果(字符串拼接麻烦易错)。2,使用vue.js 做了专门的增强,还可以是对象或数组。绑定HTML CLASS对象语法传给 v-bind:class 一个对象,动态地切换 class :<div v-bind...原创 2018-05-08 18:04:48 · 212 阅读 · 0 评论 -
vue学习记录(六)
条件渲染v-if在字符串模板中,比如Handlebars,我们得像这样写一个条件块:<!-- Handlebars 模板 -->{{#if ok}} <h1>Yes</h1>{{/if}}在Vue中,我们使用 v-if 指令实现同样的功能:<h1 v-if="ok">Yes</h1>也可以用 v-else 添加一个“else块”...原创 2018-05-16 14:08:15 · 185 阅读 · 1 评论 -
MVVM的理解与Vue生命周期
一 MVVMMVVM:Model-Veiw-VeiwModel的缩写Model:数据模型。(也可以Model中定义数据修改和操作的业务逻辑)Veiw:UI组件、视图。(将数据模型转化成UI展现出来)VeiwModel:连接Model和Veiw。(监听数据模型的改变和控制视图行为、处理用户交互)注意点:ViewModel通过双向数据绑定把Model层和Veiw层连接起来,所以Vi...原创 2019-03-01 16:48:01 · 254 阅读 · 0 评论 -
搭建vue开发环境(命令行工具)
一:项目结构相对复杂npm install --global vue-clivue init webpack my-vue注意:直接回车就好 ESLink(语法检查)需要注意 建议选no。cd my-vuenpm install ( 如果安装时没报错可以省略)npm run dev二:项目结构相对简单npm install --global vue-...原创 2019-03-21 16:08:18 · 193 阅读 · 0 评论