vue教程1-02 data里面存储数据
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title></title>
  6.     <style>
  7.  
  8.     </style>
  9.     <script src="vue.js"></script>
  10.     <script>
  11.         window.onload=function(){
  12.             new Vue({
  13.                 el:'body',
  14.                 data:{
  15.                     msg:'welcome vue',
  16.                     msg2:12,
  17.                     msg3:true,
  18.                     arr:['apple','banana','orange','pear'],
  19.                     json:{a:'apple',b:'banana',c:'orange'}
  20.                 }
  21.             });
  22.         };
  23.     </script>
  24. </head>
  25. <body>
  26.     <input type="text" v-model="msg">
  27.     <input type="text" v-model="msg">
  28.     <br>
  29.     {{msg}}
  30.     <br>
  31.     {{msg2}}
  32.     <br>
  33.     {{msg3}}
  34.  
  35.     <br>
  36.     {{arr}}
  37.     <br>
  38.     {{json}}
  39. </body>
  40. </html>

vue教程1-02 data里面存储数据的更多相关文章

  1. 利用jQuery内置的data()方法存储数据

    jQuery提供了内置的data()方法,与DOM元素不同的是,它可以用来存储key/value类型的数据.数据的存储是很容易的: $('#myDiv').data('currentState', ' ...

  2. Vue beaforeCreate时获取data中的数据

    异步获取即:通过    $this.$nextTick或者settimeout,这连dom都可以拿出来 beforeCreate() { this.$nextTick(function() { con ...

  3. Vue实例的的data对象

    介绍 Vue的实例的数据对象data 我们已经用了很多了,数据绑定离不开data里面的数据.也是Vue的核心属性. 它是Vue绑定数据到HTML标签的数据源泉,另外Vue框架会自动监视data里面的数 ...

  4. vue中的watch方法 实时同步存储数据

    watch 监视模式里面有个独特的方法handler 注意要加上deep: true.deep为true时,当对象的key值改变时也监听 当值发生改变被watch监视到触发了事件 开始执行handle ...

  5. vue 本地存储数据 sessionStorage

    在vuex 下的 action下的userAction.js中添加 export function login(from, self) { axPost('/api/login', from, fun ...

  6. vue教程3-05 vue组件数据传递、父子组件数据获取，slot,router路由

    vue教程3-05 vue组件数据传递 一.vue默认情况下,子组件也没法访问父组件数据 <!DOCTYPE html> <html lang="en"> ...

  7. vue教程2-08 自定义键盘信息、监听数据变化vm.$watch

    vue教程2-08 自定义键盘信息 @keydown.up @keydown.enter @keydown.a/b/c.... 自定义键盘信息: Vue.directive('on').keyCode ...

  8. vue教程2-05 v-for循环 重复数据无法添加问题 加track-by='索引'

    vue教程2-05 v-for循环 重复数据无法添加问题  加track-by='索引' 解决问题的代码示例: <!DOCTYPE html> <html lang="en ...

  9. Vue页面间传值，以及客户端数据存储

    初学Vue,遇到了页面传值的问题,大概网上学习了解了一下,在此跟大家分享一下学习心得,欢迎批评指正. 一.参数传值 如果是简单的页面传值,比如传一个id到详情页等等,推荐使用参数传值. 这里页面是通过 ...

随机推荐

  1. 实战fortran77基础语法

    1.数组在主函数和子例行函数中传递 一个项目中有两个源代码文件: 代码: PROGRAM ARRAYZBL DOUBLE PRECISION A,B,C,D(:) INTEGER I DATA A,B ...

  2. HDMI之(AVI)Auxiliary Video Information InfoFrame

    这是HDMI协议中关于AVI接口的信息     AVI InfoFrame在H14b中进行了定义.从HDMI 2.0 10.1 Use of the AVI InfoFrame in This Spe ...

  3. 【慕课网实战】Spark Streaming实时流处理项目实战笔记六之铭文升级版

    铭文一级: 整合Flume和Kafka的综合使用 avro-memory-kafka.conf avro-memory-kafka.sources = avro-sourceavro-memory-k ...

  4. ArcGIS的地理坐标系与大地坐标系

    一直以来,总有很多朋友针对地理坐标系.大地坐标系这两个概念吃不透.近日,在网上看到一篇文章介绍它们,非常喜欢.所以在此转发一下,希望能够对制图的朋友们有所帮助. 地理坐标:为球面坐标. 参考平面地是  ...

  5. War Chess （hdu 3345）

    http://acm.hdu.edu.cn/showproblem.php?pid=3345 Problem Description War chess is hh's favorite game:I ...

  6. （简单匹配）Card Game Cheater -- hdu --1528

    http://acm.hdu.edu.cn/showproblem.php?pid=1528 Card Game Cheater Time Limit: 2000/1000 MS (Java/Othe ...

  7. SPRING框架中ModelAndView、Model、ModelMap区别及详细分析

    转载内容:http://www.cnblogs.com/google4y/p/3421017.html 1. Model Model 是一个接口, 其实现类为ExtendedModelMap,继承了M ...

  8. hdu 1541

    因为y的输入是从小到大,所以不用考虑y坐标的问题 只考虑x坐标就行 还有个小细节就是0<=x,y,<=32000  x和y取0的时候树状数组处理不到 x++就行了 #include < ...

  9. hdu4048

    题意:给定m个数,还有n,n表示有一个长度为n的环,现在要求从M个数中选出若干个数,要求选出的数最大公约数为1,填充在n个位置中,选出的数可以重复,求多少种种方案.旋转当成一样的 . 思路:假设现在选 ...

  10. 如何让cxgrid既能充满又能根据内容进行宽度调整？

    如何让cxgrid既能充满又能根据内容进行宽度调整? 原创 2009年02月25日 10:10:00 2793 1.选中cxgridview,在属性中找OptionsView--->ColumA ...