随笔分类 -  Vue

子、父组件的数据传递(实战篇)
摘要：做一个selection 组件进行实战。效果图片如下 以下是模拟的data 数据 以下为子组件伪代码 以下为父组件的关键伪代码 阅读全文
posted @ 2018-04-25 22:40 蓝色丶格调 阅读(246) 评论(0) 推荐(0)
前端路由rooter 组件（API 使用）
摘要：路由API： 1、引入rooter import VRrouter from 'vue-router' 2、使用该组件 Vue.use（VRrouter） Vue.user 的意义：会自动阻止多次注册相同插件，届时只会注册一次该插件。 3、和后台开发一样 new VRrouter 的一个对象出来 并 阅读全文
posted @ 2018-04-24 21:47 蓝色丶格调 阅读(318) 评论(0) 推荐(0)
子、父组件的数据传递(理解篇)
摘要：组件之间是需要通信的，可以理解为子组件是一个空壳，而调用子组件的父组件赋予了它灵魂。 业务逻辑举栗： 使用select 组件 父组件需要往子组件传入数据表示使用哪些select 数据.如{"text":"重庆","v":"cq"} --父传子 当选择重庆后子组件需要返回给父组件一个value-->c 阅读全文
posted @ 2018-04-22 21:50 蓝色丶格调 阅读(634) 评论(0) 推荐(0)
Vuex (二) 代码实战
摘要：关于API的使用步骤 1、在通用的main.js 引入vuex 使用（Vue.use(Vuex)）组件并注册该组件到Vue中，使其成为为公用组件 2、可定位全局的store 提供出motations 的相关方法改变状态。例如（add(state,price)） 也可使用getter 属性通过这个获取 阅读全文
posted @ 2018-04-10 22:36 蓝色丶格调 阅读(350) 评论(0) 推荐(0)
vue 常用指令v-if v-else v-show v-for
摘要：v-show ：将元素display v-if :remove dom元素 v-else 的运用：else 必须跟在v-if 或者v-show后面 <div v-if="Math.random() > 0.5"> Now you see me </div> <div v-else> Now you 阅读全文
posted @ 2018-04-10 18:04 蓝色丶格调 阅读(273) 评论(0) 推荐(0)
动态路由的意义，以及路由重定向
摘要：to 和：to 的区别： ******** <router-link to="apple/123456">to red apple</router-link> //表示跳转只apple的子路由为123456的页面去 不带 :to <router-link :to="{path:'apple/ip'} 阅读全文
posted @ 2018-04-10 18:02 蓝色丶格调 阅读(1431) 评论(0) 推荐(0)
前端路由的理解
摘要：前端路由实现方式分为history +pushState popState 与hash +hashchange hash +hashchange: 原理： 使用www.hao123.com/#XXX #xxx是不会发给服务器的，浏览器会认为是相同的路径，所以不会对后端发起请求， 而通过按钮可以改变# 阅读全文
posted @ 2018-04-10 18:02 蓝色丶格调 阅读(162) 评论(0) 推荐(0)
socpe 与 包的引入
摘要：socpe : 控制作用域 在单文件组件里有一个 <style socped> 标签里有个socped :该属性表示在局部作用域（该组件中）下使用。 如果没有这个属性则会污染全局（引入的子组件会被污染） 对于缺少依赖包 可以在启动VUE项目的时候 使用cnpm insall vue-router s 阅读全文
posted @ 2018-04-10 18:01 蓝色丶格调 阅读(212) 评论(0) 推荐(0)
VUE 组件注册（全局、局部）
摘要：注册全局组件 也可注册局部组件。 // 注册全局 Vue.component('my-component', { template: '<div>A custom component!</div>' }) // 创建根实例 new Vue({ el: '#example', data: functi 阅读全文
posted @ 2018-04-10 18:00 蓝色丶格调 阅读(223) 评论(0) 推荐(0)