
vue-js
唐策
生活中不断积累沉淀自己,当奇迹到来时,才会降临到你身上。
-
转载 js中的join(),reverse()与 split()函数用法解析
<script> /* * 1:arrayObject.reverse() * 注意: 该方法会改变原来的数组,而不会创建新的数组。 * 2:arrayObject.join() * 注意:join() 方法用于把数组中的所有元素放入一个字符串。 * 元素是通过指定的分隔符进行分隔的。 *2017-09-28 16:23:413120
0
-
原创 vue.js中用v-for遍历出的li中的@click事件在移动端无效better-scroll
应该是使用了better-scroll的原因,默认它会阻止touch事件。所以在配置中需要加上click: true// better-scroll的原因,默认它会阻止touch事件。所以在配置中需要加上click: true// myScroll = newIScroll('#wrapper', { mouseWheel: true, click: true, tap: true })...2018-07-03 14:52:112586
0
-
原创 sublime添加vue插件语法高亮
1.首先安装sublime Text 3,去官网下载安装程序;2.让vue文件高亮:安装Package Control执行Install Package安装Vue Syntax Highlight按下Ctrl+Shift+P调出命令面板。输入install 调出 Install Package 选项并回车,然后在列表中选中要安装的插件。选择第二个:Vue Syntax High...2018-06-16 20:15:161242
0
-
原创 webpack+vue-cli打包生成资源相对引用路径与背景图片的正确引用
资源相对引用路径 问题描述 一般情况下,通过webpack+vuecli默认打包的css、js等资源,路径都是绝对的。 但当部署到带有文件夹的项目中,这种绝对路径就会出现问题,因为把配置的static文件夹当成了根路径,那么要解决这种问题,就得引用相对路径。解决办法 打开webpack.prod.conf.js找到output:增加 publicPath: ‘./’, 即可,如...2018-05-31 13:52:151936
0
-
原创 Mock.js模拟数据,脱离后端独立开发,实现增删改查功能
在我们的生产实际中,后端的接口往往是较晚才会出来,并且还要写接口文档,于是我们的前端的许多开发都要等到接口给我们才能进行,这样对于我们前端来说显得十分的被动,于是有没有可以制造假数据来模拟后端接口呢,答案是肯定的。应该有人通过编写json文件来模拟后台数据,但是很局限,比如增删改查这些接口怎么实现呢,于是今天我们来介绍一款非常强大的插件Mock.js,可以非常方便的模拟后端的数据,也可以轻松的实...2018-06-21 15:25:431457
2
-
原创 Mock.js模拟数据,脱离后端独立开发,实现增删改查功能
在我们的生产实际中,后端的接口往往是较晚才会出来,并且还要写接口文档,于是我们的前端的许多开发都要等到接口给我们才能进行,这样对于我们前端来说显得十分的被动,于是有没有可以制造假数据来模拟后端接口呢,答案是肯定的。应该有人通过编写json文件来模拟后台数据,但是很局限,比如增删改查这些接口怎么实现呢,于是今天我们来介绍一款非常强大的插件Mock.js,可以非常方便的模拟后端的数据,也可以轻松的实...2018-06-21 15:25:402381
0
-
原创 vuex 其实跟 vue 非常像,有data(state),methods(mutations,actions),computed(getters),还能模块化.
第零步 新建一个vue项目,安装vuex,这里不做过多介绍,能点进来的,默认你具备这些技能 第一步 新建一个.js 文件,名字位置任意,按照惯例,建议在/src/store 目录下(没有的话自己新建一个呗) 文件位置 /src/store/index.js// 引入vue 和 vueximport Vue from 'vue'import Vuex from 'vuex'//...2018-05-29 14:40:241746
0
-
转载 vue2入坑随记(一)-- 初始全家桶
都说Vue2简单,上手容易,但小马过河,自己试了才晓得,除了ES6语法和webpack的配置让你感到陌生,重要的是思路的变换,以前随便拿全局变量和修改dom的锤子不能用了,变换到关注数据本身。vue的官方文档还是不错的,由浅到深,但是当你用vue-cli构建一个工程的时候,发现官方文档还是不够用,得参考git上开源的项目并去学习es6。而且vue的全家桶(vue-cli,vue-router,vu...2018-05-08 15:53:30333
0
-
原创 Vue、vue-router、vuex、axios 介绍
Vue有著名的全家桶系列,包含了vue-router(http://router.vuejs.org),vuex(http://vuex.vuejs.org), vue-resource(https://github.com/pagekit/vue-resource)。再加上构建工具vue-cli,sass样式,就是一个完整的vue项目的核心构成。概括起来就是:、1.项目构建工具、2.路由、3...2018-05-08 10:45:49779
0
-
原创 vue中mixin的混合机制- new父组件
vue中提供了一种混合机制–mixins,用来更高效的实现组件内容的复用。最开始我一度认为这个和组件好像没啥区别。。后来发现错了。下面我们来看看mixins和普通情况下引入组件有什么区别? 组件在引用之后相当于在父组件内开辟了一块单独的空间,来根据父组件props过来的值进行相应的操作,单本质上两者还是泾渭分明,相对独立。 而mixins则是在引入组件之后,则是将组件内部的...2018-05-09 13:48:132211
0
-
原创 Vue keep-alive防止重复渲染DON总结
<keep-alive>是Vue的内置组件,能在组件切换过程中将状态保留在内存中,防止重复渲染DOM。<keep-alive> 包裹动态组件时,会缓存不活动的组件实例,而不是销毁它们。和 <transition> 相似,<keep-alive> 是一个抽象组件:它自身不会渲染一个 DOM 元素,也不会出现在父组件链中。prop:inclu...2018-05-09 11:05:234517
0
-
原创 Vue 的双向数据绑定原理解析
在目前的前端面试中,vue的双向数据绑定已经成为了一个非常容易考到的点,即使不能当场写出来,至少也要能说出原理。本篇文章中我将会仿照vue写一个双向数据绑定的实例,名字就叫myVue吧。结合注释,希望能让大家有所收获。1、原理 Vue的双向数据绑定的原理相信大家也都十分了解了,主要是通过 Object对象的defineProperty属性,重写data的set和get函数来实现的,这里对原理...2018-04-19 10:49:34518
0
-
原创 vue新建项目,目录文件解释
1. 2. 1、build文件夹是保存一些webpack的初始化配置。config文件夹保存一些项目初始化的配置。 2、node_modules是npm加载的项目依赖的模块。 3、src目录是我们要开发的目录,打开是这样的: 其中assets:用来放置图片 components:用来放组件文件 app.vue:是项目入口文件,代码如下: App.vue相当于...2018-03-20 14:28:384359
0
-
原创 Vue 使用 vue-router 跳转页面
使用 Vue.js 做项目的时候,一个页面是由多个组件构成的,所以在跳转页面的时候,并不适合用传统的 href,于是 vue-router 应运而生。官方文档: https://router.vuejs.org/zh-cn/essentials/getting-started.html有很多朋友找我要 demo,但是博客中的这个案例被我删掉了,我只好随手写了一个超简单的 demo,希望能有...2018-03-23 16:48:2015325
2
-
原创 如何使用Vue实现拖拽效果pageY、screenY、clientY、layerY、offsetY
1.效果图2.分清clientY pageY screenY layerY offsetY的区别在我们想要做出拖拽这个效果的时候,我们需要分清这几个属性的区别,这几个属性都是计算鼠标点击的偏移值,我们需要对其进行了解才可以继续实现我们的拖拽效果clientY 指的是距离可视页面左上角的距离 pageY 指的是距离可视页面左上角的距离(不受页面滚动影响) screenY 指的是距...2018-06-28 17:34:423453
0