• 【vue 权威指南】 学习笔记 一


    内容简介

    vue.js 是一个用来开发Web界面的前端库。

    1.vue.js 是什么

    vue.js 是一个构建数据驱动的web界面的库,vue.js 通过简单的API提供高效的数据绑定和灵活的组件系统。

    • vue.js 特性: 体积小,数据绑定,指令
    • vue 不支持低端浏览器ie6/7/8

    2.vue 的使用

    • yarn add -D vue
      vue 正式发布于2014/2

    3.数据绑定

    数据绑定是将数据和视图相关联,当数据发生变化时,可以自动更新视图。

    3.1语法
    3.1.1 插值

    文本插值,使用双大括号,{{}},

    • {{*text}} // 只需渲染一次数据,后续数据变化不再关心,可以通过*实现
    • 变量中是html片段时,可以使用三个大括号来绑定,如果使用两个大括号,html 会被当成是字符串
    <span>{{{logo}}}<span>
    logo: '<span>AAA</span>'
    
    • 双大括号也可以放在HTML标签内
      ``
  • ``

    注意: vue 指令和自身特性是不可以插值的,如果用错地方,vue会发出警告。

    3.2表达式

    {{}} 中接受表达式的值,表达式可以由JavaScript表达式和过滤器构成,过滤器可以没有,可以有多个。
    表达式是各种数值、变量、运算符的综合体

    {{example | filterA | filterB a b}} // 过滤器例子, a b 是参数
    
    3.3指令

    指令是带有v-前缀的特殊特性,其值限定为绑定表达式,也就是JavaScript表达式和过滤器。指令的作用是,当表达式的值发生变化时,将这个变化反应在DOM上

    <div v-if="show">HHH </div>
    

    另一种不同的指令,指令和表达式之前插入一个参数,用冒号分隔

    <a v-bind:href="url"></a>
    <div v-on:click="action"></div>
    
    3.4分隔符 {{ | }}

    vue 中数据绑定的语法可以配置,如果不喜欢{{}},可以自己设置,可以在Vue.config 中绑定语法,Vue.config是一个对象,包含vue 中的所有全局配置,可以在vue实例化钱修改其中的属性,

  • 相关阅读:
    linux网络编程之socket编程(三)
    linux网络编程之socket编程(二)
    字符串转成时间戳
    xls的读写
    统计词语频率保存到xls
    信息时代的学习(对于人类)
    编码格式简介:ASCII码、ANSI、GBK、GB2312、GB18030和Unicode、UTF-8,BOM头
    ThinkPHP中:RBAC权限控制的实习步骤
    getField()和select()方法的区别
    按钮美化,变化显示效果
  • 原文地址:https://www.cnblogs.com/Running00/p/10546714.html
  • Copyright © 2020-2023  润新知