Vue
当时的那个女孩
这个作者很懒,什么都没留下…
展开
-
Vue组件之间的传值
父组件向子组件传值: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <div id="app"> <di...原创 2019-12-26 17:09:05 · 141 阅读 · 0 评论 -
vue-resource实现get,post,jsonp请求
JSONP的实现原理: 由于浏览器的安全性限制,不允许AJAX访问协议不同,域名不同,端口号不同的数据接口,浏览器认为这种访问不安全. 可以通过动态创建script标签的形式,把script标签的src属性指向数据接口的地址,因为script标签不存在跨域限制,这种数据获取方式,称作JJSONP.JSONP只支持get请求. 具体实现过程: 先在客户端定义一个回调方法,预定义对数据的操...原创 2019-12-24 11:02:53 · 148 阅读 · 1 评论 -
Vue-组件基础
定义一个名为button-counter的组件: Vue.component('button-counter', { data: function () { return { count: 0 } }, template: '<button v-on:click="count++">You clicked me {{ count }} tim...原创 2019-12-20 14:54:23 · 152 阅读 · 0 评论 -
Vue-事件处理,表单输入绑定
监听事件: 使用 v-on 指令监听DOM事件,并在触发时运行一些JavaScript代码. <div id="example-1"> <button v-on:click="counter += 1">Add 1</button> <p>The button above has been clicked {{ counter }} t...原创 2019-12-20 11:23:35 · 202 阅读 · 0 评论 -
Vue-条件渲染.列表渲染
条件渲染: v-if 指令用于条件性地渲染一块内容.这块内容只会在指令的表达式返回truthy值得时候被渲染. <h1 v-if="awesome">Vue is awesome!</h1> 添加v-else块: <h1 v-if="awesome">Vue is awesome!</h1> <h1 v-else>Oh no ????&l...原创 2019-12-20 10:52:23 · 142 阅读 · 0 评论 -
Vue-计算属性,Class与Style绑定
以下内容均来自Vue官网: 计算属性和侦听器: 计算属性: <div id="example"> <p>Original message: "{{ message }}"</p> <p>Computed reversed message: "{{ reversedMessage }}"</p> </div> ...原创 2019-12-19 16:26:33 · 391 阅读 · 0 评论 -
Vue-模板语法
以下内容均来自Vue官网: 模板语法 文本: <span>Message: {{ msg }}</span> Mustache标签将会被替代为对应数据对象上msg属性的值.无论何时,绑定的数据对象上msg属性发生了改变,插值处的内容都会更新. 通过v-once指令,我们也能执行一次性地插值,当数据改变时,插值处的内容不会更新; <span v-once...原创 2019-12-18 16:32:10 · 126 阅读 · 0 评论 -
Vue实例
以下内容均来自Vue官网: 一个Vue应用由一个通过new Vue创建的根Vue实例,以及可选的嵌套的,可复用的组件树组成. 数据与方法: 当一个Vue实例被创建时,它将data对象中的所有的属性加入到Vue的响应式系统中.当这些属性的值发生改变时,视图将会产生"响应",即匹配更新为新的值.(只有当实例被创建时就已经存在于data中的属性才是响应式的.) 使用Object.freeze(o...原创 2019-12-18 13:41:31 · 97 阅读 · 0 评论