美文网首页
vue 第二天

vue 第二天

作者: 皇甫贝 | 来源:发表于2019-02-19 18:12 被阅读0次

    1.声明式渲染

    -{{ }}表达式,里面的属性会被解析
    -new Vue(参数对象)
    -参数对象
    -el:用选择器指定页面中的一个元素被Vue所管理,也可以理解成JS作用域的概念,用ID绑定,在这个元素点击事件中声明变量 这个变量只能在这个点击事件函数中执行解析,在外面就会报错
    -data,Vue实例的数据对象。里面的属性里面的值都是响应式的
    -methods存放所有的操作事件
    -filters存放所有的过滤器
    -computed:存放所有的计算属性也是一个函数。(计算属性值会缓存)
    -watchers: 监听值改变之后触发watchers属性

    指令

    -V-bind:属性被称为指令。指令带有前缀v-,以表示它们是 Vue 提供的特殊属性。可能你已经猜到了,它们会在渲染的 DOM 上应用特殊的响应式行为。简言之,这里该指令的作用是:“将这个元素节点的 title 属性和 Vue 实例的 message 属性保持一致”
    -V-if :判断
    -V-else:
    -V-else-if:
    -V-show:和v-if一样的功能 他们的区别是v-show相当于display:none,但是不能操作template对象标签
    -V-for :循环 可以迭代数组 对象 整数()
    -V-on :绑定事件
    -V-model:数据双向绑定、
    -V-once:一次性绑定使用
    -V-html:解析带有html标签的字符串

    实例

    -每个 Vue.js 应用都是通过构造函数 Vue 创建一个 Vue 的根实例 启动的
    -在实例化 Vue 时,需要传入一个选项对象,它可以包含数据、模板、挂载元素、方法、生命周期钩子等选项
    -每个 Vue 实例都会代理其 data 对象里所有的属性
    -只有这些被代理的属性是响应的。如果在实例创建之后添加新的属性到实例上,它不会触发视图更新。
    -声明周期钩子:
    每个 Vue 实例在被创建之前都要经过一系列的初始化过程。这就给我们提供了执行自定义逻辑的机会。

    模板语法

    -{{ }}

    修饰符

    -prevent修饰符,告诉V-on指令调用时调用。阻止事件冒泡,V-on:click.prevent="hfgb()"
    -过滤器 {{2*3 | hfgb}}管道符

    -缩写方式

    -V-bind:href ->:href
    -V-on:click ->@click=" "

    计算属性

    -值会缓存
    class 和 style绑定
    -数据绑定一个常见需求是操作元素的 class 列表和它的内联样式。因为它们都是属性 ,我们可以用v-bind 处理它们:只需要计算出表达式最终的字符串。
    -数组
    -对象

    列表渲染

    小结:

    -Vue实例的data属性:存放所有的可响应式的数据
    -Vue实例中的methods属性(或者方法),存放所有的操作事件
    -template标签在html文档流中解析不可见

    相关文章

      网友评论

          本文标题:vue 第二天

          本文链接:https://www.haomeiwen.com/subject/jtiwvftx.html