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. 安卓逆向学习---初始APK、Dalvik字节码以及Smali

    参考链接:https://www.52pojie.cn/thread-395689-1-1.html res目录下资源文件在编译时会自动生成索引文件(R.java ), asset目录下的资源文件无需 ...

  2. Cannot read property 'protocol' of undefined的原因和解决办法

    Cannot read property 'protocol' of undefined 原因:axios请求中的错误 1.请求地址写错了 2.没有引入http.js 3.引入http.js的时候,单 ...

  3. IDEA插件开发总结

    一:前置步骤 1.添加开发插件所需的SDK: 1.1先添加JDK 1.2打开Project Structure-Platform Settings-SDKs 1.3添加IntelliJ Platfor ...

  4. 使用mockserver来进行http接口mock

    转载自:https://blog.csdn.net/heymysweetheart/article/details/52227379:(注,这个不是很符合我的要求,它主要的作用是可以通过简单的代码就能 ...

  5. 如何使用vs进行代码比较

    当我们在进行团队合作开始项目时,有时候不仅自己要写代码还需要修改bug,当我们修改代码以后,为了保持代码库中代码的整洁美观和一直性,有些误操作,比如多一个或多个空格,多一行,少一行,格式对齐等,这样的 ...

  6. 最完美的Linux桌面软件

    下面是关于Linux桌面环境下,目前为止最完美的部分.之所以说他们完美,是因为他们不但很养眼,而且也使用最好的多媒体技术,有最好的可用性.在某些方面,他们甚至超过了Windows和Mac-OS. 基础 ...

  7. Mongoose轻松搞定MongoDB,不要回调!

    MEAN开发栈中使用MongoDB的时候,与之配对的ORM最好的选择就是Mongoose了.本文就和大家一起探讨一下如何使用Mongoose来实现MongoDB的增删改查. 为了能使文中的例子更加生动 ...

  8. kepware http接口 c语言 ruby

    读取某变量的值 require 'uri' require 'net/http' url = URI("http://127.0.0.1:39321/iotgateway/read?ids= ...

  9. java基础-day9

    第09天 java集合 今日内容介绍 u 对象数组 u 集合类之ArrayList u 学生管理系统案例 第1章   对象数组 1.1      对象数组概述 A:基本类型的数组:存储的元素为基本类型 ...

  10. POJ2270&&Hdu1808 Halloween treats 2017-06-29 14:29 40人阅读 评论(0) 收藏

    Halloween treats Time Limit: 2000MS   Memory Limit: 65536K Total Submissions: 8565   Accepted: 3111 ...