随笔分类 - Vue
摘要：<el-table :data="tableData"> <el-table-column label="备注" width="210" align="center"> <template slot-scope="scope"> <span>{{changeRemarkLength(scope.ro
阅读全文
摘要：背景 在写测试平台首页时，我想要在echarts的柱状图的点击事件中实现路由跳转功能，而直接使用this.$router.push()会报错：Uncaught TypeError: Cannot read property 'push' of undefined 解决遇到的坑 首先我想到是否可以通过
阅读全文
摘要：这次使用Vue构建旅游webapp过程中，吸收和体验了keep-alive的真实作用。 相信大家只要阅读过Vue提供的官方文档就会知道，组件想要实现数据缓存就需要在App.vue中的<router-view />外层包裹<keep-alive></keep-alive>标签，就可以很容易的实现数据缓
阅读全文
摘要：问题描述：重复点击导航时，控制台出现报错 ，虽然不影响功能使用，但也不能视而不见。 解决方案： 方案一：只需在 router 文件夹下，添加如下代码： // src/router/index.js Vue.use(Router) const router = new Router({ routes
阅读全文
摘要：方法一：直接引入vue.js文件的h5页面 created（）{ 变量直接存一下路径 var imgurl1 = "./img/tutu1.png" 然后直接赋值。 this.neme} 方法二：框架里面引入本地图片（在引入vue.js的情况下使用会报错） // 直接在data中引入。 data:{
阅读全文
摘要：1，vue中有提供反向代理的接口，就是config/index.js中的 proxyTable，我的脚手架版本是2.9.6，proxyTable配置初始为空，如下图。 2,将proxyTable配置如下： proxyTable: { '/api': { //需要代理的接口 target:'http:
阅读全文
摘要：[Violation] Added non-passive event listener to a scroll-blocking ＜some＞ event. Passive Event Listeners——让页面滑动更加流畅的新特性 Passive Event Listeners - 被动事件监
阅读全文
摘要：最近在项目中使用了Vue CLI 3.0版本，项目中需要设置反向代理解决跨域问题，下面记录一下设置过程。 新建配置文件 在项目的根目录下新建 vue.config.js 文件，自Vue CLI 3开始，项目中所有的配置信息都写在这个文件中（2在config目录中配置）。 配置反向代理 设置代理 mo
阅读全文
摘要：创建了vue-cli3脚手架项目之后，需要自己新建一个vue.config.js文件，然后配置axios，就可以请求接口获取数据了。 实现代码： 1.vue.config.js：设置反向代理，解决跨域 proxy: { '/api': { target: '请求地址', secure: false,
阅读全文
摘要：<router-link to="/aaa" @click.native="clickEvent">
阅读全文
摘要：在vue中，使用watch来响应数据的变化。watch的用法大致有三种。下面代码是watch的一种简单的用法： <input type="text" v-model="cityName"/> new Vue({ el: '#root', data: { cityName: 'shanghai' },
阅读全文
摘要：有时候我们可能需要在{{}}里添加一些需要计算再展示出来数据 例如：在页面中展示学生的成绩总分和平均分： <div id="app"> <table border="1"> <thead> <th>学科</th> <th>分数</th> </thead> <tbody> <tr> <td>数学</t
阅读全文
摘要：Vue props传递的类型和写法 1、props常用属性 type (规定数据类型) String 字符串 Number 数字 Boolean 布尔 Array 数组 Object 对象 Date 日期 Function 函数 Symbol 独一无二的值(es6) default default
阅读全文
摘要：首先检查先下this指向问题哦！很多次都是方法中嵌套function导致this.getdata（）指向出现问题，所以没有刷新页面！排除后还是不行，可以用下面强制方法试试一般能成功！要是强制也不生效就是this指向问题了。 强制渲染方法：this.$forceUpdate(); 强制刷新页面：thi
阅读全文
摘要：router.beforeEach((to,from,next)=>{}) 回调函数中的参数， to：进入到哪个路由去， from：从哪个路由离开， next：函数，决定是否展示你要看到的路由页面。 如下，判断to.path当前将要进入的路径是否为登录或注册，如果是就执行next()，展示当前界面。
阅读全文
摘要：我们通常监听一个属性变化时，代码如下 watch: { 'value': function(o,n){ } } 对value属性的监听会在value第一次变化后开始进行监听，如果我们想在创建时监听value，要使用 handler 和 immediate 对value监听 改变如下 watch: {
阅读全文
摘要：vue路由传参的三种基本方式 项目中很多情况下都需要进行路由之间的传值，想过很多种方式 sessionstorage/localstorage/cookie 进行离线缓存存储也可以，用vuex也可以，不过有些大材小用吧，不管怎么说因场景而异 下面我来说下vue自带的路由传参的三种基本方式 先有如下场
阅读全文
摘要：vue组件通信 父传子 子传父 同级组件 跨级通信 vuex（二） props和$emit(常用) $ attrs和$ listeners（跨级通信） $ parent和$ children（非常简洁） ref（获取子组件所有属性，事件等 v-model （特殊情景使用） provide和injec
阅读全文
摘要：vue组件通信 父传子 子传父 同级组件 跨级通信 vuex（一） 以下是我对Vue通信方式的总结，相对还比较全面，每一种方式都是单独的实例，不易混淆 props和$emit(常用) $ attrs和$ listeners（跨级通信） $ parent和$ children（非常简洁） ref（获取
阅读全文
浙公网安备 33010602011771号