believet93的博客

<img :src="imgPath">try { this.imgPath = require('./1.png');} catch(err) { this.imgPath = require('./default.png');}

最近在一个项目中遇到一个问题，点击按钮后，只能通过子组件向后端请求数据，但是点击按钮并不能重新加载子组件，因此无法向后端请求数据。这里我们的子组件为 childComponent，实现刷新的方法如下：<childComponent v-if="refresh"></childComponent><button @click="handleClick"></button>handleClick() { this.refresh = fa

将 window.onresize 替换成 window.addEventListener("resize",()=>{})

一、安装组件npm install vue-i18n二、定义

在v-for循环中使用ref会用一个问题，如果使用绑定 :ref 会发现，使用js是无法对绑定的元素进行操作的，原因在vue官网中有说明。但是还是希望能够在v-for中使用ref并且能够使用js对每个元素进行操作，这里就不要使用绑定的方式。下面给出了v-for中使用两种不同方式的实验结果，使用绑定的方式会报错，不使用绑定的方式可以操作成功。1、v-for中使用ref，绑定的方式<template> <div> <div class="main" @clic

1、在Vue项目的路由文件src\router\index.js路由配置上加上base:’/test/’export default new Router({base: '/ahudp_test/', // 两边斜杠要加mode: 'history',routes: [{path: '/',name: 'FontGround',components: {main: Font...

1、html部分<div id="productivities" class="em-vs-charts" style="margin-top:10px;"> <div> <div> <img style="margin:auto 15px;" src="../assets/venderstatisticsicons/icon_Ne...

参考：https://blog.youkuaiyun.com/m0_37852904/article/details/89204244

1、先上代码： <script> import { setInterval } from 'timers' export default { name: 'Monitor', data() { return { intervalId: null } }, methods: { star...

1、直接上图：2、解决办法2-1、网上找的办法将以下样式代码添加到index.html、或app.vue中（必须是入口文件，起全局作用！）body .el-table th.gutter{display: table-cell!important;}2-2、自己新建css文件common.css，在文件中将上面样式写入/* 解决element-ui的table...

官网提供了el-select的change事件，但是并没有提供使用示例，但是最近在vue项目中却要使用到。直接上代码，HTML部分<el-select @change="selectChanged" v-model="devType" size=small> <el-option v-for="item in devTypes" :key="item" :label=...

背景一般情况下，我们借用 vue-cli之力安装好所有依赖后，我们就可以愉快的板砖了。但是也经常会遇到一写问题，比如assetsSubDirectory 和 assetsPublicPath两个兄弟有时候把我搞得死去活来的，下午刚好有点空，我就去好好修理了他俩一会儿（其实是被修理）。经过无数次的，config/index.js 里面的 build配置，然后无数次的 npm run build...

直接上代码<div class="survey-distribution" ref="dtuDistribution"></div> mounted() { this.distributionChart = this.$echarts.init(this.$refs.dtuDistribution) this.distributionChart....

目标：我们希望每次新建.vue文件后，VSCODE能够根据配置，自动生成我们想要的内容。方法：打开VSCODE编辑器，依次选择“文件 -> 首选项 -> 用户代码片段”，此时，会弹出一个搜索框，我们输入vue， 如下：选择vue后，VSCODE会自动打开一个名字为vue.json的文件，复制以下内容到这个文件中：{ // Place your snip...

1、使用npm安装npm install echarts --savenpm install echarts -S以上两种都可以，也可以使用淘宝cnpm安装2、将echarts组件全部引入在main.js中添加// 引入echartsimport echarts from 'echarts'Vue.prototype.$echarts = echarts...

echarts.js的官方文档，找到了这一句window.onresize = myChart.resize; 多个图标可以这样写：window.onresize = () => { this.myChart.resize() this.myChart1.resize()}加上去，就可以自适应了，就是把window的onresize事件赋值为echar...

1、问题描述watch: { list: (newV, oldV) => { this.projectList = newV; }}按照上述写法，运行时出现undefined，这里错误的原因是使用了箭头函数。2、解决方法watch: { list: function(newV, oldV) { this.projectList = n...

1、问题描述：在组件a.vue和b.vue中a.vue<style> .top-notice { height: 38px; }</style>b.vue<style> .top-notice { height: 44px; }</style>出现上面情况时，组件a和组件b之间的样式会互...

1、vuex页面刷新保存数据到sessionstorage中 （参考其他博客https://blog.youkuaiyun.com/guzhao593/article/details/81435342），在App.vue中添加如下代码 created () { //在页面加载时读取sessionStorage里的状态信息 if (sessionStorage.getItem...

1、如下手机端的图表，可以看到legend排列不齐2、通过设置v-charts的extend属性 html代码如下：<ve-line :data="chartData" :settings="chartSettings" :extend="chartExtend" legend-position="bottom"></ve-line>...

修改build文件夹中webpack.prod.conf.js的内容如下： new UglifyJsPlugin({ uglifyOptions: { compress: { warnings: false drop_debugger: true drop_console: true ...

https://www.jianshu.com/p/4e3feddb9c60

有时候想同时 (同级) 展示多个视图，而不是嵌套展示，例如创建一个布局，有sidebar(侧导航) 和main(主内容) 两个视图，这个时候命名视图就派上用场了。你可以在界面中拥有多个单独命名的视图，而不是只有一个单独的出口。如果router-view没有设置名字，那么默认为default。<router-view class="view one"></rou...

当打包构建应用时，JavaScript 包会变得非常大，影响页面加载。如果我们能把不同路由对应的组件分割成不同的代码块，然后当路由被访问的时候才加载对应组件，这样就更加高效了。懒加载：{ path: '/login', name: 'login', component:() => import('@/views/system/log...

参考：https://blog.youkuaiyun.com/u011025083/article/details/80352301

原文链接：https://www.cnblogs.com/goloving/p/9074410.html

1、npm WARN ajv-keywords@2.1.1 requires a peer of ajv@^5.0.0 but none is installed. You must install peer dependencies yourself.需要更新npm，更新命令：npm install -g npm接着：npm install查看npm版本： npm -v2、尝试一...

原文链接：https://blog.youkuaiyun.com/weixin_40104695/article/details/88033804

报错如下：vue.esm.js?efeb:1897 TypeError: Cannot read property '__ob__' of undefined at VueComponent.Vue.$destroy (vue.esm.js?efeb:3998) at destroy (vue.esm.js?efeb:3168) at invokeDestroyHook...

1、原生的input，使用 @keyup.enter；原生的按钮也使用@keyup.enter；2、element-ui的el-input，使用 @keyup.enter.native；因为element-ui把input进行了封装，原事件就不起作用了。<input type="text" placeholder="手机号" v-model="phoneNumber" @keyup...

1、html部分： <el-table ref="PendingTable" :data="projectsInfo" style="border-radius:5px;" :header-cell-style="{'border-bottom':'solid 1px #d2d3da'}"> <el-table-column fixed="left...

1、此处只给表头添加下边框，使用header-cell-style属性： <el-table ref="PendingTable" :data="projectsInfo" style="border-radius:5px;" :header-cell-style="{'border-bottom':'solid 1px #d2d3da'}"> </e...

将父组件的高度设置为屏幕所需要展示的高度,另外设置父组件的overflow:scroll;<div v-else :style="'height:' + screenHeight + 'px'" ref="element"> <mt-loadmore :bottom-method="loadBottom" :bottom-all-loaded="allLoaded"...