vue
Tempta36
这个作者很懒,什么都没留下…
展开
-
对Vue.nextTick()和mounted()的理解
Vue.nextTick()在Vue生命周期的created()函数中进行DOM操作是要放在Vue.nextTick()回调函数中。原因就是created()在执行的时候DOM只是创建出来并没有渲染在页面上,因此页面上没有这个元素也就无法对其进行操作。当页面进行某个操作后,部分DOM随数据的改变而改变,这个时候就应该将这个操作放在Vue.nextTick()的回调函数中执行。mount...转载 2018-07-27 09:43:00 · 6207 阅读 · 0 评论 -
vue登录时点击登录之后显示cannot post/
框架:vue请求插件:axios场景:实现登录功能错误场景:点击登录按钮之后,页面跳转并显示cannot post/,请求后台的接口未被调用。源码如下:<form method="post" action="" class="layui-form" > <input name="username" placeholder="用户名" type原创 2018-10-18 17:59:27 · 35458 阅读 · 1 评论 -
vue实现二级菜单的显示或隐藏
场景:二级菜单用html写死的,而不是以通过data和v-for动态生成的今天在实现的过程中,出现了问题。实现思路如下:data中设置menuIsShow为一个数组,数组的元素为boolean值,表示一级菜单是否显示或隐藏。在html中对应的二级菜单元素上绑定menuIsShow的值,如:class="{showItem:menuIsShow[0]}",然后在对应的一级菜单元素上绑定事件改变...原创 2018-10-11 17:35:50 · 6799 阅读 · 0 评论 -
vue-cli配置反向代理解决跨域及过程理解
vue-cli提供了配置反向代理的接口,即设置config/index.js中的proxyTable。配置如下:dev: { ...... proxyTable: { '/api':{ //将www.exaple.com印射为/apis target:'https://www.exaple.com', //跨域地址 change...原创 2018-09-19 10:21:16 · 2882 阅读 · 1 评论 -
初始学习vue2时整理的小知识点
1.让webpack+vue-cil项目不再自动打开浏览器打开 /config/index.js 中设置如下autoOpenBrowser: false2.superagent组件相当于jquery的ajax,提供了非常方便的api接口3.配置运行端口打开 /config/index.js 中 port 的值...原创 2018-07-26 16:35:20 · 137 阅读 · 0 评论 -
Vue2进阶知识点
数据与方法当一个Vue 实例被创建时,它向Vue的响应式系统中加入了其 data对象中能找到的所有的属性。当这些属性的值发生改变时,视图将会产生“响应”,即匹配更新为新的值。// 我们的数据对象var data = { a: 1 }// 该对象被加入到一个 Vue 实例中var vm = new Vue({ data: data})// 获得这个实例上的属性// 返...原创 2018-09-09 18:10:48 · 617 阅读 · 0 评论 -
vue2学习小计
双向数据绑定原理:通过数据劫持结合发布者-订阅者模式的方式实现 具体:首先对数据进行劫持监听(使用Object.defineProperty),设置一个监听器Observer,用来监听所有属性。当属性发生变化,订阅者Watcher收到属性的变化通知并执行相应的函数,从而更新视图。解析器Compile扫描和解析每个节点的相关指令,并根据初始化模板数据以及初始化相应的订阅器。 直通车指令及...原创 2018-08-21 16:21:46 · 235 阅读 · 0 评论 -
提交mutations之后,state的值没有发生变化
vuex相关代码(user.js)let users = [ {"username":"Lucy","password":"123456","login":false}, {"username":"qweasd","password":"123456","login":false}, {&quo原创 2018-08-27 20:13:41 · 1725 阅读 · 0 评论 -
vue的双向绑定原理及实现
https://www.cnblogs.com/libin-1/p/6893712.html转载 2018-08-02 14:06:33 · 165 阅读 · 0 评论 -
vue2实战:在线翻译
源码参考:https://blog.csdn.net/qq_35788269/article/details/80655985 项目实现的功能就是左侧输入框输入需要翻译的内容,右侧输入框选择要转换的语言,点击翻译按钮就可以得到翻译的结果并显示在下方! 这个项目对于初学vue的小伙伴来说刚刚好,比较简单,能够练习配置项目环境,简单的使用vue,子组件如何向父组件传递数据等。首先,列出这个项目...原创 2018-08-06 15:53:54 · 515 阅读 · 1 评论 -
基于vue-cli+vue2+vuex+vue-router的仿简书官网项目
由于guthub库搜索vue2项目大部分都是移动端,因此本人仿照简书官网做了pc端的实操项目。本项目为纯前端实现,所有数据均为前端自造。且仅实现了部分功能。github源码地址 https://github.com/Tempta36/fangjianshu/项目成果环境搭建npm install --gloabal vue-cli //全局安装vue-clivue init...原创 2018-10-09 14:52:30 · 1137 阅读 · 3 评论