394 vue路由使用注意事项
摘要：入口 最常用的入口 是 声明式导航 router link 组件 js const One = { template： } js One Two html Document ONE ONE TWO
阅读全文
posted @ 2020-03-21 15:07
随笔分类 - vue
393 vue路由介绍，路由的基本使用
摘要：零、路由介绍 路由 ： 是浏览器 URL 中的哈希值( # hash) 与 展示视图内容 之间的对应规则。 简单来说，路由就是一套映射规则(一对一的对应规则)， 由开发人员制定规则. 当 URL 中的哈希值( # hash) 发生改变后，路由会根据制定好的规则， 展示对应的视图内容 为什么要学习路由
阅读全文
posted @ 2020-03-21 15:06
392 单页面应用程序概述
摘要：单页面应用程序 SPA : Single Page Application MPA : Multiple Page Application 多页面应用程序 区别 单页面优势 : 1. 减少了请求体积，加快页面响应速度，降低了对服务器的压力 2. 更好的用户体验，让用户在 web app 感受 nat
阅读全文
posted @ 2020-03-20 09:03
389 vue非父子之间通讯 ，事件总线 (event bus），$on注册，开关灯案例
摘要：十二、非父子之间通讯 ( 组件 ⇒ 组件 ) (重点) 需求 ： 组件 jack > 恁弄啥哩 > 组件 rose 事件总线bus用于管理事件， vuex用于管理数据状态。 是通过 事件总线 (event bus 公交车) 的机制 来实现的 事件总线 ： 实际上就是一个 空Vue实例 可以实现任意两
阅读全文
posted @ 2020-03-20 08:39
388 vue 之 props： 只读，prop的大小写，prop的类型，prop的校验
摘要：十、props 的特点 ： 只读 演示验证 props 只读 传的是简单类型 ： 修改会报错 传的复杂类型 (地址) ： 修改不会报错，是因为地址没有变 ，测试 obj={}立马报错 【修改对象中的数据，不会修改对象的地址，但是修改对象的地址就报错。】 修改父组件传给子组件的数据 思路 ： 把接收过
阅读全文
posted @ 2020-03-20 08:17
387 vue保存属性的地方，单向数据流(组件与组件之间)
摘要：八、目前为止保存属性的地方 1. data 2. 计算属性 3. props 九、单向数据流(组件与组件之间) 所有的 prop 都使得其父子 prop 之间形成了一个 ： 父级 prop 的更新会向下流动到子组件中，但是反过来则不行。 这样会防止从子组件意外改变父级组件的状态【数据】，从而导致你的
阅读全文
posted @ 2020-03-20 07:50
386 vue组件通信：概述，父组件传递给子组件 (props)，子组件传递给父组件($emit)
摘要：五、组件通讯 (介绍) 导入 ： 演示子组件访问父组件数据，发现报错 【父组件访问子组件数据，也报错】 组件是一个独立、封闭的个体 也就是说 ： 默认情况下，组件中的数据， 只能在组件内部使用，无法直接在组件外部使用 可以将 vue 实例看做一个组件 对于组件之间需要相互使用彼此的情况，应该使用 组
阅读全文
posted @ 2020-03-20 07:49
385 组件：vue组件概述，组件化开发，组件的基本使用，组件的data是函数
摘要：一、组件 组件可以看作是一些可复用的ui模块 小到一个标签 ： <div>哈哈</div> 大到一个页面 ：<div><div><div><div><div></div></div></div></div></div> 一个组件对应 一个实例 组件 Vue实例 == new Vue ( option
阅读全文
posted @ 2020-03-20 07:45
384 json-server， axios
摘要：使用接口的形式发送数据 一 、json server 提供假数据接口 1. json server 作用 : 根据指定的 JSON 文件, 提供假数据接口 2. 地址 : "json server" 3. 使用步骤 js 1. 全局安装 json server : 2. 准备一个json数据 3.
阅读全文
posted @ 2020-03-18 12:45
383 Vue生命周期：挂载阶段，更新阶段，销毁阶段，钩子函数
摘要：Vue生命周期三大阶段 概述 第一个大阶段 ： 挂载阶段 (4个钩子) 第 1 个小阶段 ： 数据初始化 == msg ： 测试信息 beforeCreate() 数据响应式之前调用 特点 ： 无法获取到数据和事件 created() (★★★★★) 【created：重在操作数据，mounted：
阅读全文
posted @ 2020-03-17 16:29
382 vue过滤器：全局过滤器，局部过滤器，moment 插件，过滤器参数，全局和局部的使用区别
摘要：过滤器 1. 概念 vue 中的过滤器(filter) : 数据格式化 , 也就是说,让数据按照我们规定的一种格式输出 比如 : 对于日期来说,将日期格式化转化为 格式的过程 2. 全局过滤器 和 局部过滤器 说明 : 通过 全局方式创建的过滤器 ，在任何一个 Vue 实例中都可以使用 (一般情况下
阅读全文
posted @ 2020-03-17 08:21
381 vue 之 监听 watch：数据持久化，监听基本数据类型，监听对象，计算属性和watch的区别
摘要：1、数据持久化 (本地存储) 1. 可以在数组的`增删改`, 都要保存一下, 比较繁琐 2. 监听数组的变化, 数组一旦发生变化, 在监听里面 保存一下(代码写一遍就可以了) vue 提供了一个监听器. TodoMVC 数据持久化 需求 : 将todoMVC中的数据, 保存到 本地存储中 (本地持久
阅读全文
posted @ 2020-03-17 08:16
380 vue数据响应式问题：$set()
摘要：1. 数据 : obj > name > 有值(zs) , 绑定: v-modle='obj.name' ==> ok 2. 在某个事件中, 直接添加属性,是不行的, this.$set() 处理 总结 : 1. 以后尽量先在data里声明好, 给一个初始值, 以后就可以正常使用了 2. 在一些第三
阅读全文
posted @ 2020-03-17 08:13
379 vue的异步 DOM 更新：nextTick
摘要：1、Vue 中采用了 异步DOM更新 的机制 2、如何更新页面 数据发生改变后, vue 没有立即将数据的改变更新到视图中, 而是等到数据不再变化的时候 一次性的 将 数据的改变更新到视图中 // 1. 验证了 for (let i = 0; i < 1000; i++) { this.count+
阅读全文
posted @ 2020-03-17 08:12
378 vue 之 事件修饰符，按键修饰符，v-if 和 v-show，计算属性 computed，key，条件渲染指令 v-else 和 v-else-if
摘要：七、事件修饰符 01 事件修饰符.html 八、按键修饰符 记住 keyCode 太麻烦了 1. 只有在键盘事件中生活效, (keydown、keypress、 keyup) 2. 语法 : @keyup.enter='事件函数' .enter 就是一个按键修饰符, 意思就是当按回车的时候, 事件才
阅读全文
posted @ 2020-03-15 19:30
377 TODOMVC：准备工作，配置 vue，列表渲染，添加任务，删除任务，编辑任务 ，Footer 的显示与隐藏
摘要：一 、准备工作 1. "vue TodoMVC" 2. 演示 3. "下载模板地址" 4. 安装依赖包 : 二、配置 vue 1. 安装 vue : 2. 导入 vue : `` 在 里的 导入之前导入,因为 app.js 里 就要用到 vue 了 3. 实例化 vue :在 中创建 vue 示例,
阅读全文
posted @ 2020-03-15 19:26
376 vue指令：v-model (常用)，v-text 和 v-html，v-bind (常用)，操作样式，v-on，v-for，v-pre，v-once，v-cloak
摘要：解释：指令 ，Directives， 是带有 v- 前缀的特殊属性，可以在html标签中使用，可以看成特殊的html属性 作用：指令提供了一些特殊的功能，当指令绑定到标签上时，可以给标签增加一些特殊的行为 比如 ： v-model、 v-bind、 v-if、 v-for 等等 【本质：底层:DOM
阅读全文
posted @ 2020-03-14 13:58
375 vue数据双向绑定演示：一个 input + v-model，Object.defineProperty，数据双向绑定的原理简单实现
摘要：5.1 一个 input + v-model v-model 指令 ： 数据双向绑定的指令 作用 ： 把data中的msg值 和 input上的值 绑定到一起 注意 ： v-model只能用在 表单控件上 (input checkbox 等) > 可以在浏览器分别演示 V => M 和 M =>V
阅读全文
posted @ 2020-03-14 13:48
浙公网安备 33010602011771号