摘要:一、watch属性的使用 1.传统方式实现双向数据改变监听事件(姓名拼接案例) <div id="app"> 姓: <input type="text" value="" @keyup="textChange()" v-model="firstname"/> + 名: <input type="te 阅读全文
posted @ 2020-10-28 22:19 千夏Chinatsu 阅读(27) 评论(0) 推荐(0) 编辑
摘要:一、什么是路由 对于普通的网站来说,所有的超链接都是URL地址,所有的URL地址都对应服务器上对应的资源 对应单页面的应用程序来说,主要通过URL中的hash(#号)来实现不同页面之间的切换,同时,hash有一个特点:HTTP请求中不会包含hash相关的内容,所以,单页面的应用程序的页面跳转主要用h 阅读全文
posted @ 2020-10-28 22:18 千夏Chinatsu 阅读(34) 评论(0) 推荐(0) 编辑
摘要:一、模块化与组件化 模块化的定义 模块化在Node中是一个规范,定义一些模块的相关的规则,从代码角度上来说,方便做区别,如果不使用模块化,写在js文件中不利于后期维护和扩展,从代码的层面上就把相关的功能脱离出来,所以模块化从从代码的角度触发,分析项目,把项目中一些功能类型的代码,单独抽离为一个个的模 阅读全文
posted @ 2020-10-28 22:17 千夏Chinatsu 阅读(361) 评论(2) 推荐(2) 编辑
摘要:官方文档:https://cn.vuejs.org/v2/guide/transitions.html 一、使用过度类名 没有使用动画之前: <body> <div id="app"> <input type="button" value="切换" @click="flag=!flag"/> <h4 阅读全文
posted @ 2020-10-28 22:16 千夏Chinatsu 阅读(42) 评论(0) 推荐(0) 编辑
摘要:一、导入相关包 <script src="../lib/vue2.6.10.min.js"></script> <script src="../lib/axios-v0.17.1.js"></script> 二、设置容器 <div id="app"> </div> 三、 测试数据能否接收成功 Vue 阅读全文
posted @ 2020-10-28 22:15 千夏Chinatsu 阅读(30) 评论(0) 推荐(0) 编辑
摘要:一、使用vue-resource发起get请求 github仓库地址:https://github.com/pagekit/vue-resource/blob/develop/docs/http.md <body> <div id="app"> <input type="button" value= 阅读全文
posted @ 2020-10-28 22:13 千夏Chinatsu 阅读(30) 评论(0) 推荐(0) 编辑
摘要:vue实例的生命周期 什么是生命周期:从Vue实例创建、运行、到销毁期间,总是伴随着各种各样的事件,这些事件,统称为生命周期! 生命周期钩子:就是生命周期事件的别名而已; 生命周期钩子 = 生命周期函数 = 生命周期事件 主要的生命周期函数分类: 创建期间的生命周期函数: beforeCreate( 阅读全文
posted @ 2020-10-28 22:12 千夏Chinatsu 阅读(28) 评论(0) 推荐(0) 编辑
摘要:一、什么是Vue 官方文档:https://cn.vuejs.org/v2/guide/ 关键字: 渐进式框架 自底向上增量开发 视图层 单文件组件 复杂的单页应用 复杂的单页应用: 顾名思义,单页应用一般指的就是一个页面就是应用,当然也可以是一个子应用,比如说知乎的一个页面就可以视为一个子应用。单 阅读全文
posted @ 2020-10-24 19:50 千夏Chinatsu 阅读(66) 评论(0) 推荐(1) 编辑
摘要:认真学习,认真记录,每天都要有进步呀!!! 加油叭!!! 一、在vue中使用样式的方式: 1. 直接传递一个数组,注意: 这里的 class 需要使用 v-bind 做数据绑定 <style> .red { color: red; } .thin { font-weight: 200; } .ita 阅读全文
posted @ 2020-10-24 19:43 千夏Chinatsu 阅读(39) 评论(0) 推荐(0) 编辑
摘要:vue指令之v-for和key属性 一、 v-for 1. v-for遍历数组 <div id="app"> <h3>好饿,我好想吃~~~~</h3> <ul v-for="menu in list"> <li>{{menu}}</li> </ul> </div> <script> var vm = 阅读全文
posted @ 2020-10-24 19:41 千夏Chinatsu 阅读(59) 评论(0) 推荐(0) 编辑