zoukankan      html  css  js  c++  java
  • 写给自己看的vue

    学习过程:自学(个人demo驱动),论坛,qq群多少听到vue,react(很抱歉只弄了hello world demo 虚拟dom 也是概念 到目前也没弄清楚)这类框架(工作经历前后端都折腾,老板指到拿 打到哪)。

    基础:接触过angularjs1.0 实际经验,使用了绑定,指令,和http请求。一个字学习难度大 ,复杂 (提到他原因是:第一次接触的js的 mvc框架,幸运的是之前折腾过wpf的 mvvm 所以看起来比较亲切)。

    资料:官网 https://cn.vuejs.org/v2/guide/installation.html 目前看了3遍(多看官网api 是学习新的一门技术基础,仅供参考)。 http://www.cnblogs.com/keepfool/p/5619070.html (推荐)

    书籍:

    章节:

    1:介绍 

    响应式编程即:状态和视图同步(一句话mv**,同门师兄弟有angularjs。react ,早期的backbone ) 

    2:基本语法

    <!-- 引入js文件 -->
    <script src="https://unpkg.com/vue"></script>
    
    <!-- 视图
        1:{{}} vue 数据绑定 界面第一次加载网络慢会出现 {{}}
        解决办法: css添加 [v-cloak] { display: none;} 使用者添加v-cloak属性 或者v-text
        2:v-model 一般用于表单( input、textarea> 、 select等 )
    -->
    <div id="app-6">
      <p>{{ msg }}</p>
      <input v-model="msg">
    </div>
    //vue 对象都是从new开始(这一点为什么不学jquery 少写一个new呢)ps:它是连接视图(view)和data的桥梁 (就叫他控制器吧)。
    //el:挂载元素(常用id class 等选择器) 告诉浏览器大哥这一段html的元素 用vue法语解析(类似编辑器)。我的地盘要听我的(它的内部是如何解析呢 他怎么知道是vue呢这也是它的神奇吧)
    //data :数据区 (ps:msg 文本框自定改变)
    var app6 = new Vue({
      el: '#app-6',
      data: {
        msg: 'Hello  '
      }
    })

    总结:

    • Vue构造函数的:选项el属性,就是element缩写,当前Vue对象挂载到哪个标签上的语法

    • Vue的选项:data属性数据。vue会把自定义的数据可以与html的模板数据进行绑定。

    • Vue 数据绑定的方式就是用{{}}

    • 页面加载出现{{}}的解决办法。
    • vue的思想简单介绍。

    2:指令、事件、表单

    待续完成。

  • 相关阅读:
    TOJ3650 Legal or Not
    Fork/Join框架之双端队列
    [每日一题] OCP1z0-047 :2013-08-26 TIMESTAMP WITH LOCAL TIME ZONE....................112
    [C++基础]C++中静态成员函数如何访问非静态成员
    HDU 1504 Disk Tree
    Android Checkbox Example
    STM32F103定时器输出PWM波控制直流电机
    SICP 习题 (1.7) 解题总结
    Linux磁盘及文件系统管理 4---- Linux文件系统挂载管理
    推荐《Linux 多线程服务器端编程》
  • 原文地址:https://www.cnblogs.com/y112102/p/9473568.html
Copyright © 2011-2022 走看看