vue
mkmin
主要对新手入门
展开
-
vue脚手架使用px2-rem
px2-rem在vue脚手架项目中的使用cnpm install px2rem-loader -Dcnpm install lib-flexible -Spackage.json中配置 "postcss": { "plugins": { "autoprefixer": {}, "postcss-px2rem-exclude": { "remUnit": 75, "exclude": "/node_modules/i" }原创 2020-09-27 17:14:21 · 351 阅读 · 0 评论 -
vue:使用脚手架搭建一个项目备用
为了方便后面做一些vue的小项目,这边构建一个简单点的vue脚手架项目baseVueCliMobile关于一个基于vue脚手架的移动端基础项目技术栈vue相关插件axios文件路径:src/utils/axios.js思路:直接在文件中创建一个axios,然后对它做出拦截,封装等操作,随后抛出一个已经完成封装的axios作用:接口封装event-bus文件路径:src/utils/bus.js思路:引入一个全新的vue实例,然后使用vue的监听机制,避免引入vuex过大的问原创 2020-09-27 11:12:29 · 163 阅读 · 0 评论 -
vue-cli 使用vue-bus来全局控制
觉得vuex泰国繁琐?试试简单好用的vue-bus原创 2017-07-31 18:16:36 · 5220 阅读 · 0 评论 -
基于vue-cli的vue项目之vuex的使用4-------moudles分块
按照官方文档,就是为了避免代码太长了。所以使用了moudle1.store.js//配置仓库,第五道第二十六为一个模块。第二十七到四十八为一个模块,在第四十九到五十四行抛出import Vue from 'vue';import Vuex from 'vuex';Vue.use(Vuex);const moudlesa = { namespaced:true,state: {原创 2017-09-22 09:13:17 · 1141 阅读 · 0 评论 -
基于vue-cli的vue项目之vuex的使用3-------action异步传参
由于使用commit是同步的,所以也就有了使用“异步”的action的诞生1.store.js//配置仓库第十五行到第二十三行配置action,import Vue from 'vue';import Vuex from 'vuex';Vue.use(Vuex);const store = new Vuex.Store({ state: { count: 0 }, mutat原创 2017-09-21 11:29:17 · 2696 阅读 · 0 评论 -
基于vue-cli的vue项目之vuex的使用2-------commit参数
1.安装 npm install vuex2.vuex/store.js//仓库状态管理,第19行。将store抛出import Vue from 'vue';import Vuex from 'vuex';Vue.use(Vuex);const store = new Vuex.Store({ state: { count: 0 }, mutations: {原创 2017-09-20 16:47:08 · 7279 阅读 · 0 评论 -
一个“错误”的vuex写法:vuex刷新了数据但是视图没有刷新
这是个很尴尬的问题,让我猜猜看你的代码是不是这样写的: 点击我 {{countnumber}} export default { name: 'app', data() { return { countnumber: this.$store.state.count, } }, methods: { clickme: func原创 2017-09-20 16:17:32 · 12849 阅读 · 7 评论 -
基于vue-cli的vue项目之vuex的使用1---------最简单的vuex模板
基础什么的,肯定要从最简单的模型学起1.安装 npm install vuex2.vuex/store.js//仓库状态管理,第19行。将store抛出import Vue from 'vue';import Vuex from 'vuex';Vue.use(Vuex);const store = new Vuex.Store({ state: { count: 0原创 2017-09-20 15:36:59 · 569 阅读 · 0 评论 -
安装npm install时,长时间停留
没错,。就是在安装npm的时候,一直停留在某个地方,很明显,是网速问题(百分之九十概率),所以还是用淘宝的镜像吧。。。。npm config set registryhttps://registry.npm.taobao.org检查:npm config get registry当然!你可以考虑关闭长城防火墙,哈哈然后请继续你的表演。。。...原创 2017-09-28 18:19:59 · 31231 阅读 · 5 评论 -
vue-cli for循环
vue-cli前端for循环下标原创 2017-07-17 23:11:20 · 2790 阅读 · 3 评论 -
vue组件内部绑定class还有style样式
vue-clivue 组件vue class与style的绑定原创 2017-07-17 23:02:19 · 8068 阅读 · 0 评论 -
vue-cli更换端口号
vue-cli 更换端口号原创 2017-07-15 03:51:36 · 3962 阅读 · 0 评论 -
vue-cli开发vue项目1组件化开发
vue-cli开发1-组件化开发原创 2017-07-06 23:35:26 · 2338 阅读 · 1 评论 -
vue:打包过后的文件报js找不到
文章标题可能描述的不太清楚(反正我也不知道怎么写)大概理解为:打包过后的文件放在服务器上时一片空白,然后打开f12后是这样的错误:这个就比较明显了,是js的路径有问题,那么!请问,这个是哪一步环节出错了呢?先不着急百度,自己推一推,(为了排除很多其他的因素,这儿我就直接运行一开始的那个项目了) 大家猜一猜是上面哪个文件夹在起作用?vue文件目录结构:http://w...原创 2018-12-07 17:20:05 · 16562 阅读 · 0 评论 -
vu-cli 关闭es-lint的方法
今天下午懒得比较闲,所以就开始复习下我的vue,想搭建个后台管理的框架,但是忘了关闭es-lint,想到一连串的莫名其妙的错,比如:以上是项目刚生成时候的错误本来想严格要求下自己的,想想还是放弃了,不想影响自己美好的下午于是乎。我们打开 我们的vue项目目录下的build/webpacke.base.config.js接下来:将第四十三行的注释掉,在重启下(怎么...原创 2018-12-07 15:36:05 · 655 阅读 · 0 评论 -
vue的路由优化
最近有点皮忙,都不怎么写博客了。首先是换了份新工作,需要加班的情况比较多,其次的话年初给自己定下的目标(lol满英雄退游)还差差不多8/141,所以需要多花点时间去完成自己的电竞梦,写博客就随便来一篇糊弄下吧,反正我一直也是这样做的,看得懂我意思的人,自然一眼就明白精髓,看不太懂的,也只能让我指出,所以文章的质量就无所谓啦,而且把。。。准备一篇博客至少也要来个30分钟的时间,差不...原创 2019-05-06 18:01:18 · 1478 阅读 · 4 评论 -
v-for在对象与数组中的区别
代码测试:<template> <div class="hello"> <div v-for='(args1,args2,args3) in myobject'> args:{{args1}},{{args2}},{{args3}} </div> <hr /> <div v-for='(args1,ar...原创 2019-06-15 17:38:04 · 1365 阅读 · 0 评论 -
vue:slot
什么是slot差不多就是上面那个意思吧,由于更多的还是作为一个component的一个附属性的功能,所以不做过多的解释,就理解为“插槽”,由于基本都是用在“插入”的方式,所以用法比较单一,比较简单粗暴slot的常用方式一般来说有下面这两种情况:单个slot具名slot:结构大概是这样的:在界面/父界面中使用到组件,其次在组件中加入自己要编写的代码,然后再组件...原创 2019-06-17 16:57:23 · 768 阅读 · 0 评论 -
基于vue-cli的vue项目之vuex的使用5------watch监听vuex内部数据变化
1.vue/index.js//在vuex中配置主要用到togglepage2,第十六到第十八import Vue from 'vue';import Vuex from 'vuex';Vue.use(Vuex);const store = new Vuex.Store({ state: { id: 0, showpage2: true, showpage1:true, }原创 2017-09-25 18:34:07 · 18309 阅读 · 2 评论 -
基于vue-cli的vue项目之axios的使用6--配置axios
有时候需要写很长的路径,烦,所以可以将相同的操作写在一起,如果需要修改,可以在axios请求的时候修改1.配置config/index.js:解决跨域问题dev: { env: require('./dev.env'), port: 8008, autoOpenBrowser: false, assetsSubDirectory: 'static', assetsPubl原创 2017-09-08 11:59:48 · 2927 阅读 · 0 评论 -
vue 组件之间使用eventbus传值
eventbusvuevue-cli组件传值原创 2017-07-15 03:40:19 · 47982 阅读 · 8 评论 -
vue如何导入外部js文件(es6)
vue 怎么倒入外部js文件原创 2017-07-29 11:18:10 · 79016 阅读 · 10 评论 -
基于vue-cli的vue项目之路由2--param传参
使用vue的param传参原创 2017-09-04 22:58:21 · 2822 阅读 · 1 评论 -
基于vue-cli的vue项目之路由3--watch监听路由
有时候我们需要监听路由,做出某种操作。。。代码主要在app.vue上1.hello.vue页面//获取一个参数,第五行显示 这个是hello页面,穿过的参数是{{$route.params.hparam1}} export default { name: 'hello', data() { return { msg: 'this is th原创 2017-09-05 15:28:52 · 22073 阅读 · 0 评论 -
基于vue-cli的vue项目之路由4--嵌套路由
嵌套路由,很是常用1.hello.vue:含有嵌套路由的页面,主要在第五六七行,第二十,二十一监听,注意监听的对象 这个是hello页面,穿过的参数是{{$route.params.hparam1}} children1页面 children2页面 export default { name: 'hello', data()原创 2017-09-05 16:01:53 · 1504 阅读 · 2 评论 -
基于vue-cli的vue项目之路由5--router.push,go,replace方法
想要导航到不同的 URL,则使用 router.push 方法。这个方法会向 history 栈添加一个新的记录,所以,当用户点击浏览器后退按钮时,则回到之前的 URL。当你点击 时,这个方法会在内部调用,所以说,点击 等同于调用router.push(...)。https://router.vuejs.org/zh-cn/essentials/navigation.html原创 2017-09-05 16:38:57 · 2286 阅读 · 0 评论 -
基于vue-cli的vue项目之路由6--重定向1-----path无参重定向
首先声明一点,重定向有不少中,还有,不一定需要跟我写的一样,使用require,可以使用import。只是个人喜欢1.hello.vue子界面:用来显示的子界面 这个是hello.vue页面 export default { name: 'hello', }2.router/index.js:路由配置文件,关键在于第二十三到第二十六行import Vue原创 2017-09-06 09:57:06 · 1330 阅读 · 0 评论 -
基于vue-cli的vue项目之路由6--重定向2-----页面初始化重定向
vue 路由重定向原创 2017-09-06 10:36:14 · 2215 阅读 · 0 评论 -
基于vue-cli的vue项目之路由1--最基本的使用
代码如下,下面是嘴简单的基础搭配:1.第一个子页面./components/hello.vue<template> <div class="hello"> <h1>这个是hello页面</h1> <h2></h2> </div></template&am原创 2017-09-03 23:07:08 · 3241 阅读 · 0 评论 -
基于vue-cli的vue项目之路由6--重定向1-----路径无参重定向
有时候可能会觉得使用path太过于方便,而比较喜欢想使用路径,以及设置其他参数的方法,个人比较喜欢这种复杂点的1.hello.vue子界面:用来显示的子界面 这个是hello.vue页面 export default { name: 'hello', }2.router/index.js:路由配置文件,关键在于第二十八到第三十四行import Vue f原创 2017-09-06 10:46:02 · 674 阅读 · 0 评论 -
基于vue-cli的vue项目之路由6--重定向3-----method返回重定向路径
重定向方法返回路径原创 2017-09-06 10:59:02 · 2472 阅读 · 0 评论 -
基于vue-cli的vue项目之路由6--重定向4-----path带参重定向
不过很遗憾,这种方式我个人,请注意,是我个人因为技术不够,无法在页面初始化的时候带参数,可能可以实现这种方法吧。。。1.hello.vue子界面:用来显示所传参数的子界面 这个是hello.vue页面 {{$route.params.hparams1}} export default { name: 'hello', }2.router/index.js:路原创 2017-09-06 11:09:45 · 3448 阅读 · 0 评论 -
基于vue-cli的vue项目之axios的使用1--准备工作
使用axios的准备工作,其实这个应该属于插件吧,不应该属于vue的1.npm添加axios:npm install axios2.在main.js导入:import axios from 'axios'3.将其添加在原型链上:Vue.prototype.$http=axios4.在config/index.js修改dev,(开发环境下解决跨域问题)dev: { env: r原创 2017-09-08 10:15:39 · 2457 阅读 · 0 评论 -
基于vue-cli的vue项目之axios的使用2--最基础的请求
先抱歉下,下面的请求的链接,我会把域名隐藏起来,所以想尝试的朋友麻烦自己找一条重新测试,很抱歉了在下面也配置了跨域的1.config/index.js的配置:解决跨域 dev: { env: require('./dev.env'), port: 8008, autoOpenBrowser: false, assetsSubDirectory: 'static',原创 2017-09-08 10:28:12 · 3143 阅读 · 0 评论 -
基于vue-cli的vue项目之axios的使用3--get传参请求
以get传参请求为例子,1.配置config/index.js:解决跨域问题dev: { env: require('./dev.env'), port: 8008, autoOpenBrowser: false, assetsSubDirectory: 'static', assetsPublicPath: '/', proxyTable: { '/ajaxu原创 2017-09-08 10:47:50 · 18566 阅读 · 0 评论 -
基于vue-cli的vue项目之axios的使用4--并发请求
并发请求,还是那句话,,,,域名被藏匿了1.配置config/index.js:解决跨域问题dev: { env: require('./dev.env'), port: 8008, autoOpenBrowser: false, assetsSubDirectory: 'static', assetsPublicPath: '/', proxyTable: {原创 2017-09-08 11:10:43 · 5524 阅读 · 0 评论 -
基于vue-cli的vue项目之axios的使用5--axios方法发送请求
既然jq有ajax方法,那么axios有没有axios方法?答案是肯定的,依旧隐藏了域名1.配置config/index.js:解决跨域问题dev: { env: require('./dev.env'), port: 8008, autoOpenBrowser: false, assetsSubDirectory: 'static', assetsPublicPath:原创 2017-09-08 11:26:43 · 2788 阅读 · 0 评论 -
vue生命进程
vue的生命周期原创 2017-07-09 22:57:32 · 967 阅读 · 0 评论