zoukankan      html  css  js  c++  java
  • VUE注意

    模板表达式都被放在沙盒中,只能访问全局变量的一个白名单,如 MathDate 。你不应该在模板表达式中试图访问用户定义的全局变量。

    从 2.6.0 开始,可以用方括号括起来的 JavaScript 表达式作为一个指令的参数:

    <!--
    注意,参数表达式的写法存在一些约束,如之后的“对动态参数表达式的约束”章节所述。
    -->
    <a v-bind:[attributeName]="url"> ... </a>


    修饰符

    修饰符 (modifier) 是以半角句号 . 指明的特殊后缀,用于指出一个指令应该以特殊方式绑定。例如,.prevent 修饰符告诉 v-on 指令对于触发的事件调用 event.preventDefault()

    <form v-on:submit.prevent="onSubmit">...</form>

    在接下来对 v-onv-for 等功能的探索中,你会看到修饰符的其它例子。

    缩写

    v- 前缀作为一种视觉提示,用来识别模板中 Vue 特定的 attribute。当你在使用 Vue.js 为现有标签添加动态行为 (dynamic behavior) 时,v- 前缀很有帮助,然而,对于一些频繁用到的指令来说,就会感到使用繁琐。同时,在构建由 Vue 管理所有模板的单页面应用程序 (SPA - single page application) 时,v- 前缀也变得没那么重要了。因此,Vue 为 v-bindv-on 这两个最常用的指令,提供了特定简写:

    v-bind 缩写

    <!-- 完整语法 -->
    <a v-bind:href="url">...</a>
    
    <!-- 缩写 -->
    <a :href="url">...</a>
    
    <!-- 动态参数的缩写 (2.6.0+) -->
    <a :[key]="url"> ... </a>

    v-on 缩写

    <!-- 完整语法 -->
    <a v-on:click="doSomething">...</a>
    
    <!-- 缩写 -->
    <a @click="doSomething">...</a>
    
    <!-- 动态参数的缩写 (2.6.0+) -->
    <a @[event]="doSomething"> ... </a>


    你可以像绑定普通属性一样在模板中绑定计算属性。Vue 知道 vm.reversedMessage 依赖于 vm.message
    因此当 vm.message 发生改变时,所有依赖 vm.reversedMessage 的绑定也会更新。
    而且最妙的是我们已经以声明的方式创建了这种依赖关系:计算属性的 getter 函数是没有副作用 (side effect) 的,这使它更易于测试和理解。
     
  • 相关阅读:
    CSS关键词的值-currentColor关键字提示文字(当前颜色)
    DOM 对象方法
    CSS三种样式表
    html页面不使用缓存的代码
    DOM-----style属性对照表
    UISwitch属性
    UIImageView属性
    UIView属性
    UIScrollView
    UILabel属性
  • 原文地址:https://www.cnblogs.com/justart/p/12438848.html
Copyright © 2011-2022 走看看