vue教程1-02 data里面存储数据
<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title></title>

    <style>

    </style>

    <script src="vue.js"></script>

    <script>

        window.onload=function(){

            new Vue({

                el:'body',

                data:{

                    msg:'welcome vue',

                    msg2:12,

                    msg3:true,

                    arr:['apple','banana','orange','pear'],

                    json:{a:'apple',b:'banana',c:'orange'}

                }

            });

        };

    </script>

</head>

<body>

    <input type="text" v-model="msg">

    <input type="text" v-model="msg">

    <br>

    {{msg}}

    <br>

    {{msg2}}

    <br>

    {{msg3}}

    <br>

    {{arr}}

    <br>

    {{json}}

</body>

</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. jQuery 常用效果

    hide和show 同样有 fadeInhe fadeOut 的功能 $(document).ready(function(){ $("#hide").click(function ...

  2. vue父传子

    父组件传递数据给子组件用props,父组件中使用子组件,子组件用props接收父组件数据. Home父组件代码: <template> <div> {{test}} <! ...

  3. CHAPITRE III

    Il me fallut longtemps pour comprendre d'où il venait. Le petit prince, qui me posait beaucoup de qu ...

  4. UVa 11077 Find the Permutations (计数DP)

    题意:给定 n 和 m,问你在 1 ~ n 的所有排列中,有多少个排列满足至少要交换 m 次才能变成 1 2 3 ... n. 析:首先,先考虑一下,某个排列,要变成 1 2 3 .. n,最少要交换 ...

  5. C#和java的对比及总结

    1.Java里的AClass.class得到的Class<T>类的对象对应C#的typeof(AClass)得到的Type类型的对象:(但是C#如果要反射创建对象是用Type对象的Asse ...

  6. 安卓 build/core/Makefile 以及main.mk

    android make 系统总共分为四层 arch board device product 在各个字android.mk文件中引用的定义都存放在./build/core/下!比如android.m ...

  7. 1.gil全局解释器锁, 2. 死锁与递归锁 3. 信号量 4. Event事件 5. 线程queue

    gil本质就是一把互斥锁,相当于执行权限,每个进程都会存在一把gil,同一进程内的多个线程必须抢到gil 之后才能使用cpython解释器来执行自己的代码,同一进程下的多线程不能并行,但可以实现并发 ...

  8. spoj COT2(树上莫队)

    模板.树上莫队的分块就是按dfn分,然后区间之间转移时注意一下就好.有个图方便理解http://blog.csdn.net/thy_asdf/article/details/47377709: #in ...

  9. Codeforces Round #540 (Div. 3)--1118B - Tanya and Candies(easy TL!)

    Tanya has nn candies numbered from 11 to nn. The ii-th candy has the weight aiai. She plans to eat e ...

  10. Codeforces Round #536 (Div. 2) B. Lunar New Year and Food Ordering

    #include <bits/stdc++.h> #define N 300010 #define PII pair<int, int> using namespace std ...