zoukankan      html  css  js  c++  java
  • vue渐进式开发的理解和指令

    1.vue渐进式开发

    vue是一个渐进式的框架,轻量,易于上手,为啥是渐进式那,我当时也很蒙,比如的官网是jquery写的,就可以通过script标签引入事先准备好的vue.min.js的压缩源代码或者是通过http引入官网的代码。如下,

     

     

     

     

     

     

     然后在body下面写个script或者单独写个js文件引导这个页面。el属性是这个页面的根节点,里面的data就可以随便定义了。

     

     

     使用vue里的数据就跟平常一样,{{变量名}},  v-for渲染数组或者对象就ok了。这就是最简单的vue的渐进式开发,不需要借助vue脚手架。并且一些静态数据比较多的话,

     还是比较适合的。这是我对vue渐进式开发的理解,后面如果项目大,就可以npm install vue vuex了。

    2.vue的一些基本指令,语法:v-指令名

    v-text 只能解析文本,解析出来的文本作为标签的内容展示 =={{}}

    v-html 解析标签

    v-bind :属性名 //绑定动态属性 简写 :属性名

    属性名=“变量名”按字符串解析

    :属性名=“变量名” 按变量解析

    v-for

    //循环对象

    (value,key,index) in obj 

    :key="唯一标识" 如index

    第一个value是对象里面的每一项value值,第二个是对象里面的每一项的key,第三项下标;

    //循环数组

    (item,index,key)in list

    第一个是数组里面的每一项 第二个是下标 第三个 没用

    //循环数字

    (item,index,key)in Number

    第一个是从1开始的一个整数,第二个是下标,第三个没用

    v-show ="true"展示或隐藏 ===>style="display:none;"或display:block;

    v-on:eventname=""//绑定事件 简写@eventname 

    eventname(click,keyup input change)

    @eventname.修饰符

    prevent 阻止默认事件的修饰符 @click.prevent

    stop 阻止冒泡行为

    self 只触发自身事件,不会触发其他元素 与冒泡类似

    captrue 捕获阶段触发的

    once 只触发一次

    left 左键触发

    rigth 鼠标右键触发

    middle鼠标中建触发

    keyCode/keyalias 键盘状态码/键盘别名

  • 相关阅读:
    九度 1363 欢乐斗地主
    九度 1377 缓变序列
    九度 1376 最近零子序列
    转几篇关于linux下AT&T汇编的帖子
    九度 1358 陈博的平均主义
    九度 1394 五连击数组
    HDU 2817 A sequence of numbers
    HDU 1867 A + B for you again
    HDU 1753 大明A+B
    HDU 1715 大菲波数
  • 原文地址:https://www.cnblogs.com/xiaopeilin/p/12802277.html
Copyright © 2011-2022 走看看