zoukankan      html  css  js  c++  java
  • vue2.0学习(一)

    1.解决双花括号在初始化时的闪烁,两种方式,一种是<div v-text="name"></div>,将用v-text指令来显示,类似于angular的ng-bind;

    另外一种是用v-clock配合css:

    <div v-cloak>{{name}}</div>

    <style>
      [v-cloak]{
        display:none;
      }

    </style>

    当然在这里css只需要写一次就好了。

    2.双花括号中可以运行js表达式(只能有一个),比如说if语句不可以在双花括号中运行,简单的语句可以用三目运算,复杂建议用computed;模板表达式都被放在沙盒中,只能访问全局变量的一个白名单,如 Math 和 Date 。你不应该在模板表达式中试图访问用户定义的全局变量。

    3.所有的内置filter都去掉了,所以filter只能自己去定义。

    4.var obj =  {};Object.keys(obj);这个可以取到所有的对象的属性。属于es5的方法。

    5.vue双向数据绑定的原理

    var a= {}
    Object.defineProperty(a,"b",{
      set:function(newValue){

        console.log("你要赋值给我,我的新值是"+newValue)

      },
      get:function(){
        console.log("你取我的值")
      }
    })

    var defineA = function(){
      a.b = 1;
    }
    defineA();

    这里利用的是es5的Object.defineProperty,用这种方法给每个data创建一个set和get,当给data赋值的时候,就会触发set,进而去通知v-text这个指令去改变相应的值。具体如下图

  • 相关阅读:
    掌控像素的虚实
    多用组合,少用继承
    HTML5的语法变化和新增加元素
    又逢六月
    设计心情之心情设计
    web2.0生成器(超过100个)[转]
    css+div CSS教程——元素定位
    项目进度
    清华大学统一认证接口与PHP的调用
    将51JOB的求职意向选择框Down了
  • 原文地址:https://www.cnblogs.com/Upton/p/5969475.html
Copyright © 2011-2022 走看看