vue
baoleilei6
微信号:bll1286971588 欢迎交友
展开
-
Vue.js2.0从入门到放弃---入门实例(一)
http://blog.csdn.net/u013182762/article/details/53021374最近,vue.js越来越火。在这样的大浪潮下,我也开始进入vue的学习行列中,在网上也搜了很多教程,按着教程来做,也总会出现这样那样的问题(坑啊,由于网上那些教程都是Vue.js 1.x版本的,现在用Vue.js 的构建工具都已经升级到2.0版本了),经过了一段时间的转载 2017-05-06 15:04:47 · 981 阅读 · 0 评论 -
vue $emit
父组件<template> <div class="content"> <List @setDisplayDetail="setDisplayDetail"/> </div></template>...methods : { setDisplayDetail(val){ this.displayDetail = val; }原创 2017-12-17 11:23:21 · 568 阅读 · 0 评论 -
nodejs/webpack项目提示Invalid Host header
nodejs项目在本地访问正常,然而部署到服务器上就提示Invalid Host header。原因:新版的webpack-dev-server出于安全考虑,默认检查hostname,如果hostname不是配置内的,将中断访问。解决方法:修改webpack.config.js中的devServer选项disableHostCheck: true例如:……d原创 2017-12-31 14:02:39 · 685 阅读 · 0 评论 -
vue-cli proxy代理
config/index.js下'use strict'// Template version: 1.3.1// see http://vuejs-templates.github.io/webpack for documentation.const path = require('path')function proxy() { return { target: '目标网站', c...原创 2018-03-26 19:13:14 · 2137 阅读 · 0 评论 -
vue2 实现 div contenteditable="true" 类似于 v-model 的效果
问题在 vue2 中对表单控件有着良好的双向数据绑定机制,但是对于要特定实现某些功能的输入时,我们就不得不使用到 contenteditable="true" 的 div ,而在这个 div 上是使用 v-model 是没有效果的。那么问题就来了,输入是非常需要双向绑定的,这里的双向数据绑定该如何实现?解决思路一:自定义指令当然,说在这一段的前面,这种解决方式在 vue2 中是不行的,...转载 2018-08-15 17:30:17 · 5234 阅读 · 2 评论 -
vue.js window.removeEventListener 移除
有个小坑记录下,想要移除window的addEventListener,需要把后面的function挂在到this上,removeEventListener 和 addEventListener 中对应的参数要一致。 beforeDestroy() { //在组件生命周期结束的时候销毁。 window.removeEventListener('scroll...转载 2018-11-14 13:57:03 · 21707 阅读 · 2 评论 -
ES6 新增的 Array 操作
https://juejin.im/post/5c846af3f265da2da835a8751、find 和 findIndexfind() 传入一个回调函数,找到数组中符合当前搜索规则的第一个元素,返回这个元素,并且终止搜索。const arr = [1, "2", 3, 3, "2"]console.log(arr.find(n => typeof n === "...原创 2019-05-14 18:48:04 · 725 阅读 · 0 评论 -
立方阶时间复杂度 O(n^3) 详解
时间复杂度计算:执行最多次的语句----->次数数量级----->复杂度结果O()立方阶 O(n^3)计算示例1.最基本的立方阶 for(i=1; i<=n; i++) for(j=1; j<=n; j++) for(k=1; k<=n; k++) s++;1234循环...原创 2019-07-14 21:51:57 · 3020 阅读 · 0 评论 -
VueJS源码学习——MutationObserver实现nextTick
Vue 倡导开发者尽量不直接操作 DOM,但有的时候由于各种需求让开发者不得不这样做,于是nextTick的实现就是让开发者在修改数据后,能够在数据更新到 DOM 后才执行对应的函数,从而获取最新的 DON 数据。原文地址项目地址那么如何实现nextTick呢,我们首先可以想到的是利用setTimeout的异步回调来实现,不过由于各个浏览器的不同,setTimeout 的延迟...转载 2019-07-10 17:51:36 · 883 阅读 · 0 评论 -
vue实现一个移动端屏蔽滑动的遮罩层
vue实现一个移动端屏蔽滑动的遮罩层在扯废话浪费大家的时间之前,先上个代码好了,使用vue实现起来很简单…… div class="overlayer" @touchmove.prevent > /div>对,就是这么简单,加上@touchmove.prevent就可以屏蔽滑动页面了,然后再和普通的遮罩层一样,加点样式/*遮罩层*/转载 2017-12-01 18:12:21 · 3584 阅读 · 0 评论 -
vuex中关于mapState,mapGetters,mapMutations,mapActions的作用
在开始接触vuex框架的时候对那些state,action,mutation,getter等理解的还挺顺利的,然后突然出来一种加了一个前缀的mapState等,这样的就有点蒙圈了。。。特别是官方的文档并没有给除详细的说明跟例子。。。然后就自己慢慢理解了一下。其实也就是一个重命名而已。。。以下就是例子,希望能帮助理解:在store中代码[html] view plain转载 2017-10-03 19:05:25 · 4640 阅读 · 0 评论 -
Vue.js 2.0从入门到放弃---入门实例(二)
http://blog.csdn.net/u013182762/article/details/53027883前面一篇博客介绍了从零开始准备Vue.js所需的一些环境和工具。这片博客就来跟大家探讨一下Vue.js 2.0中的一些特性,以及一个小实例,通过实例来跟大家分享,想必更容易理解。先来看一下,看完这篇博客,你会做出什么样的效果吧。就是这样的一个小的d转载 2017-05-07 08:37:44 · 2960 阅读 · 0 评论 -
Vue.js2.0从入门到放弃---入门实例(三)
http://blog.csdn.net/u013182762/article/details/53488870已经有几周没有更新博客了,最近自己也在学习就没有能及时抽身来写博客。今天就来简单说一下vue-resource,这是vue的一个与服务器端通信的HTTP插件,用来从服务器端请求数据。话不多说,直接上干货吧。这里PS一下,有人反映之前的代转载 2017-05-07 08:39:59 · 848 阅读 · 0 评论 -
vue项目优化之按需加载组件-使用webpack require.ensure
http://www.7zhang.com/index/cms/read/id/231714.html使用 vue-cli构建的项目,在 默认情况下 ,执行 npm run build 会将所有的js代码打包为一个整体,打包位置是 dist/static/js/app.[contenthash].js 类似下面的路由代码 router/index.js转载 2017-05-07 09:12:55 · 502 阅读 · 0 评论 -
nodejs 加载模块时,路径中的前缀“@”表示什么意思?
alias: 简化模块路径名称的输⼊。build/webpack.base.conf.js里已配置:resolve: { extensions: ['.js', '.vue', '.json'], alias: { 'vue$': 'vue/dist/vue.esm.js', '@': resolve('src') //原创 2017-07-14 14:57:52 · 2538 阅读 · 0 评论 -
关于ES6的 模块功能 Module 中export import的用法和注意之处
export default命令用于指定模块的默认输出。显然,一个模块只能有一个默认输出,因此export deault命令只能使用一次。所以,import命令后面才不用加大括号,相反其它的export 输出 可以有多个,且import时必须加大括号,示例如下: 1 // modules.js 2 function add(x, y) { 3 return x * y; 4转载 2017-07-15 08:19:15 · 655 阅读 · 0 评论 -
Vuex速学篇:(1)基本套路
我们前面做了一个这样的页面,为了增加我们的学习难度,我们特意拆分成了不同的组件。 我们知道,我们在子组件里并不能直接对兄弟组件里的属性进行操作,我们通过this.$emit() 调用父组件的方法,通过this.$parent.$data.username 获取兄弟组件里的属性。 但是如果我们的业务越来越复杂,组件越来越多,会造成我们的整个项目维护起来非常的困难。能不能把各个组件的逻转载 2017-07-16 11:24:17 · 688 阅读 · 0 评论 -
weexpack 创建项目, 打包Android 和 ios
哎呀,做前端, 打包一个app有点难搞,又是初接触 weex, 之前没找到怎么打包, 看了些帖子似乎需要 android 建项目,但是不懂android, 搞了一天也没好我去, 浪费了不少时间, 终于找到了 weexpack , android的apk按步骤很快就搞好了,下面是一个weex项目打包成 安卓和ios apk的步骤命令 ( ios没有设备,所以只成功打了安卓的, 但是ios命令转载 2017-07-18 10:07:21 · 923 阅读 · 0 评论 -
Vue路由开启keep-alive时的注意点
这个不是业务的要求,但是看到每次进入页面就重新渲染DOM然后再获取数据更新DOM,觉得作为一个前端工程师有必要优化下的加载逻辑,正好vue提供了keep-alive的功能,所以就试用了下。当然,干任何事儿都不会一帆风顺的,在路上的磕磕碰碰在所难免,故在此记录下遇到的问题,希望看到这篇文章的人能有所帮助。ps:这个也没多难。HTML部分:template> div class="app"原创 2017-07-18 14:26:33 · 510 阅读 · 0 评论 -
【Vue源码】Vue中DOM的异步更新策略以及nextTick机制
本篇文章主要是对Vue中的DOM异步更新策略和nextTick机制的解析,需要读者有一定的Vue使用经验并且熟悉掌握JavaScript事件循环模型。引入:DOM的异步更新<template> <div> <div ref="test">{{test}}</div> <button @click="handleCl...原创 2019-07-10 18:25:44 · 916 阅读 · 1 评论