vue
文章平均质量分 54
Null_Bugs
这个作者很懒,什么都没留下…
展开
-
vue结合iview使用面包屑导航
1、配置路由{ path: '/list', meta: [{ title: 列表'}], name: 'MinePicture', component: () => import('../views/lists/list.vue'),},{ path: '/list/detail/:id', meta: [{ title: '列表',url:'/list' }, { title: '详情'}], name: 'pictureDetail', componen原创 2020-09-11 16:04:34 · 970 阅读 · 0 评论 -
iview中表单单独进行验证
let _self = this new Promise(function (resolve, reject) { _self.$refs['formCustom'].validateField("mobile", (error) => { resolve(error) }) }).then((data)=>{ .原创 2020-07-16 16:26:34 · 1111 阅读 · 0 评论 -
vue中create-api
1.组件中必须设置name2.3.this.$create组件名4.注意只能是字符串,字符串可以响应式改变props原创 2019-11-28 21:22:56 · 1024 阅读 · 0 评论 -
vue中多个组件调用同一个接口
export function getData(callback){ let opt = { method : 'get', url: '/user', success: res => { callback(res.data.value || []) }, fail:err =&...原创 2019-11-07 21:04:29 · 1545 阅读 · 0 评论 -
vue中锚点的三种方法
第一种: router.js中添加 mode: 'history', srcollBehavior(to,from,savedPosition){ if(to.hash){ return { selector:to.hash } } ...原创 2018-07-05 17:21:21 · 20061 阅读 · 0 评论 -
vue中批量引入自定义指令
首先我这边目录是下面这样的anchor.js export default { inserted : function(el,binding){ el.onclick = function(){ document.documentElement.scrollTop = $('#anchor-'+binding.value).offset().top } }}index.js ...原创 2018-07-05 18:00:25 · 1300 阅读 · 0 评论 -
vue项目引用vue-awesome-swiper,组件小demo
首先:main.js import VueAwesomeSwiper from 'vue-awesome-swiper' import 'swiper/dist/css/swiper.css'子组件: <template> <div class="scroll"> <swiper :options="swiperOption" ref="my...原创 2018-07-06 14:08:49 · 948 阅读 · 0 评论 -
vue中引用echarts,自适应
子组件:<template> <div :id="id"></div></template><script> import echarts from 'echarts' export default { data () { return { chart...原创 2018-07-06 14:58:23 · 1698 阅读 · 1 评论 -
Vue调试神器vue-devtools安装
手动安装第一步:找到vue-devtools的github项目,并将其clone到本地. vue-devtoolsgit clone https://github.com/vuejs/vue-devtools.git第二步:安装项目所需要的npm包npm install //如果太慢的话,可以安装一个cnpm, 然后命令换成 cnpm install第三步:编译项目文件npm run build第...转载 2018-07-13 15:51:08 · 530 阅读 · 0 评论 -
vue中在vuex的actions中请求数据
actions.js getCertificationStatus(context, {vm:vm,type:type}){ return new Promise((resolve, reject) => { axios.post('/realNameUtils/gotoStatusPage') .then((res)=>{ ...原创 2018-07-26 14:35:32 · 7166 阅读 · 1 评论 -
vue中使用elementui的表格展开的属性 type=“expand” 没有数据的不显示展开按钮,有数据才会显示
<el-table :default-expand-all="true" :row-class-name="getRowClass"></el-table> getRowClass:function(row,rowIndex){ if(row.row.childMessageTypeUserRnVos.len...原创 2018-07-21 16:36:11 · 17089 阅读 · 3 评论 -
vue中列表点击按钮出现弹框,点击弹框外弹框消失
<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>Vue 测试实例 - 菜鸟教程(runoob.com)</title> <script src="https://cdn.bootcss.com/vue转载 2018-09-03 11:05:10 · 10150 阅读 · 1 评论 -
vue中倒计时组件
子组件:<template> <span :endTime="endTime" :callback="callback" :endText="endText"> <slot> {{content}} </slot> </span> </templat原创 2018-07-05 10:00:51 · 1105 阅读 · 0 评论 -
vue中写一个简单的三级联动的组件
父组件<three-level :applyDataArr="applyDataArr" :title="title"></three-level>定义一个applyDataArr 和title变量 子组件需要的注意 :这个 applyDataArr 是请求数据的一个大的数组 三级联动所需要的所有的数据 树状的 不是一个下拉框一个数组的子组件<templ...原创 2018-06-27 15:33:11 · 3341 阅读 · 0 评论 -
学习vue中遇到的一些注意事项
1、注册事件 .native <my-component v-on:click.native="doTheThing"></my-component>2、修改prop的数据 定义一个局部变量,并用prop的值初始化它。 props: ['initialCounter'], data: function () { return { count...原创 2018-06-22 10:41:17 · 493 阅读 · 0 评论 -
vue中的一些注意事项
在使用v-for的时候,如果想要拿到下标:v-for="(item,index) in products"在原生的: [1,2].foreach(function(value,index){ console.log(value,index)})jquery: $.each(function(index,value){})加载图片: v-bind:src="item.productIm...原创 2018-03-29 23:02:50 · 1253 阅读 · 0 评论 -
vue购物车地址列表
注意:给more加事件的时候我们可以@click="limitNum=addressList.length"new Vue({ el:'.address', data:{ addressList:[], limitNum:3, curentIndex:0, shippingMethod:1 }, mounted:function(){ this.$nextTick(function(){...原创 2018-03-30 08:43:01 · 407 阅读 · 0 评论 -
vue脚手架搭建
前提是安装了node,搭配了node环境 ……………………第一步安装webpack打开命令行工具输入:npm install webpack -g,安装完成之后输入 webpack -v,如下图,如果出现相应的版本号,则说明安装成功。第二步安装vue-cli安装vue-cli脚手架构建工具,打开命令行工具输入:npm install vue-cli -g,安装完成之后输入 vue -V(注意这里是...原创 2018-03-30 09:56:03 · 190 阅读 · 0 评论 -
命令行运行vue-cli+webpack项目没有自动在浏览器打开
// Various Dev Server settings host: 'localhost', // can be overwritten by process.env.HOST port: 8080, // can be overwritten by process.env.PORT, if port is in use, a free one will be determi...原创 2018-03-30 20:39:40 · 591 阅读 · 0 评论 -
vue中vue-router、transition、keep-alive结合使用
<transition :name="name"> <keep-alive> <router-view class="router-view" v-if="$route.meta.alive"></router-view> </keep-alive></tr原创 2018-03-27 12:09:09 · 2737 阅读 · 6 评论 -
axios的跨域问题
1、server端不支持跨域,比如遇到下面的这种情况No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://xxx.com' is therefore not allowed access.解决方案:如果server端是自己开发的,那么修改相关代码支持跨域,如果不是自己...转载 2018-04-10 09:00:47 · 402 阅读 · 0 评论 -
vue中radio或者checked如何默认选中?
attrList数据:[ { propertyValueId: 1, valueData: "sku1 text alias" }, { propertyValueId: 2, valueData: "sku1 text alias" }, { propertyValueId: 3, valueData: ...原创 2018-03-28 19:08:49 · 12166 阅读 · 0 评论 -
vue中使用一些插件
1.vue中使用layer插件 npm i vue-layer --save import layer from 'vue-layer' Vue.prototype.$layer = layer(Vue);原创 2018-04-17 17:33:09 · 383 阅读 · 0 评论 -
安装node-sass报错
npm i node-sass --sass_binary_site=https://npm.taobao.org/mirrors/node-sass/原创 2018-04-17 17:35:08 · 841 阅读 · 0 评论 -
vue使用elementui上传
<el-upload class="avatar-uploader" action="" name = 'pic' :show-file-list="false" :before-upload="beforeAvatarUpload5"> <img v-if="imgUrl5" :src="imgUrl原创 2018-06-14 12:40:12 · 1700 阅读 · 2 评论 -
Vue 第一个组件,浏览器后退无法触发beforeRouteLeave的问题
VUE路由控制是基于h5的history API实现而beforeRouteLeave又是基于window.onpopstate该事件仅在按了浏览器按钮或者调用history.back()方法时生效,且在同一document的两条历史记录条目间的导航才会生效,而上文出现的原因正是不属于同一document...原创 2018-06-07 13:25:19 · 8467 阅读 · 0 评论 -
vuex的理解
vuex是一个专门为vuejs设计的集中式状态管理架构。状态简单来说就是data中需要共用的属性。1、引入vuex 利用npm install vuex --save2、x新建一个store文件夹,并在文件夹下面新建一个store.js文件,文件中引入我们的vue和vuex import Vue from 'vue' import Vuex from 'vuex'3、使用vuex...原创 2018-03-20 12:06:56 · 311 阅读 · 0 评论