zoukankan      html  css  js  c++  java
  • vue基础点

    1、v-model:主要在表单中使用,双向功能;
    2、插值:
      {{}} : 文本插值,将数据解释为纯文本
      v-text: 
      v-html:输出真正的html,数据绑定会被忽略,只对可信内容使用 HTML 插值,绝不要对用户提供的内容插值,不能使用 v-html 来复合局部模板,因为 Vue 不是基于字符串的模板引擎
      v-text:文本渲染,类似{{}}} 
    3、v-show:控制显示、隐藏(添加display:block/none)
    4、v-if:控制显示、隐藏,DOM结构有或没有,支持<template></template>
    5、v-bind:绑定属性,给DOM元素添加属性,绑定内联样式
    6、v-for:循环,可以是数组,也可以是对象,可以与组件使用
    7、v-on:事件绑定
    8、v-once:执行一次性地插值,当数据改变时,插值处的内容不会更新
     
    9、组件(component):提供了一种抽象,让我们可以用独立可复用的小组件来构建大型应用,一个组件实质上是一个拥有预定义选项的一个 Vue 实例,所有的 Vue.js 组件其实都是被扩展的 Vue 实例;要确保在初始化根实例 之前 注册了组件
     
     
    10、过滤器:过滤器只能在 mustache 绑定中使用,由“管道符”指示;过滤器函数总接受表达式的值作为第一个参数
     
    11、修饰符
      1)事件修饰符:在事件处理程序中调用 event.preventDefault() 或 event.stopPropagation() 是非常常见的需求,v-on提供了事件修饰符,由点(.)表示的指令后缀来调用
            
      2)按键修饰符:监听键盘事件时,我们经常需要监测常见的键值
            
            
     
       3).lazy:v-model 在 input 事件中同步输入框的值与数据,但你可以添加一个修饰符 lazy ,从而转变为在 change 事件中同步;(v-model.lazy)
       4).number:自动将用户输入值转为number类型(v-model.number)
       5).trim:自动过滤用户输入的首尾空格
            
     
    12、计算属性(computed  计算缓存):复杂逻辑,应当使用计算属性(需要展示的数据,有一定的逻辑处理时使用),计算属性是基于他的依赖缓存(只有在它的相关依赖发生改变时才会重新取值),计算属性默认只有getter(),但是需要时也可以设置setter()
      计算属性 和 method :都可以实现最终结果,计算属性有一个计算缓存,若相关依赖不改变就不执行此函数;method每当重新渲染就会执行;
      计算属性 和 watch :用于观察 Vue 实例上的数据变动,来响应数据的变化,执行异步操作或昂贵操作
     
    13、表单控件绑定:v-model绑定,绑定的 value 通常是静态字符串(对于勾选框是逻辑值);绑定 value 到 Vue 实例的一个动态属性上,这时可以用 v-bind 实现,并且这个属性的值可以不是字符串;
  • 相关阅读:
    [HNOI2002]营业额统计
    HDU 1374
    HDU 3345
    HDU 2089
    Graham扫描法
    Codeforces 1144D Deduction Queries 并查集
    Codeforces 916E Jamie and Tree 线段树
    Codeforces 1167F Scalar Queries 树状数组
    Codeforces 1167E Range Deleting
    Codeforces 749E Inversions After Shuffle 树状数组 + 数学期望
  • 原文地址:https://www.cnblogs.com/fan-lily/p/6641205.html
Copyright © 2011-2022 走看看