vue
hua_ban_yu
这个作者很懒,什么都没留下…
展开
-
el-table使用v-if显示错乱问题
el-table使用v-if显示错乱问题原创 2022-03-25 10:57:59 · 5770 阅读 · 2 评论 -
vue如何debugger
vue官方提供了两种debugger的方式:1.使用Vue Devtools 插件,该方式需要安装翻墙插件才可以; 2 在vscode原创 2022-03-23 17:56:30 · 20238 阅读 · 1 评论 -
Duplicate keys detected: ‘***‘. This may cause an update error
在开发vue项目时遇到Duplicate keys detected: '13'. This may cause an update error错误,这个错不会影响页面显示,但是会一直在控制台上打印。如图错误原因:v-for循环时设置的key值不是唯一的。如图解决方案设置v-for循环的key是唯一的。如图...原创 2021-08-26 10:47:26 · 11393 阅读 · 2 评论 -
vue-router.esm.js:2065 Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation to
在开发vue项目使用路由跳转当前页面发现控制台报错vue-router.esm.js:2065 Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation to current location: "/instDetail?instId=3" 错误。错误原因:使用this.$router.push跳转页面时,对应的query参数和当前地址栏上的参数一样导致解决方案: 判断地址栏上的in...原创 2021-08-18 11:21:57 · 7056 阅读 · 0 评论 -
vue如何跳转本页面
在使用vue开发项目时遇到一个需求,点击标题跳转当前页面。通过this.$router.push已经更改了url上面的参数,但是页面没有重新加载,这个要如何处理呢?可以通过使用watch监听地址栏上的参数变化实现页面数据更新。实现代码: watch: { $route: { // 监听路由的参数变化 handler () { // 数据变化更新数据 this.instId = this.$route.query.instId this.g.原创 2021-08-18 11:12:29 · 1735 阅读 · 0 评论 -
vue父组件传子组件数值,子组件值没有变
在使用vue开发项目时遇到一个这样的问题,由于项目多成封装,数据是从祖父组件传给孙子组件,中间隔了一个父组件,由于孙子组件不能直接修改值,所以定义了一个变量,从而导致祖父组件更新内容后,孙子组件内容没有发生变化。如图解决方法:在孙子组件中watch监听input输入变更的值祖父组件 <search-choose :filterObj="secondFilterArr[i]" v-if="secondFilterArr.length&g...原创 2021-08-06 15:49:27 · 3947 阅读 · 0 评论 -
We‘re sorry but ‘xxx‘ doesn‘t work properly without JavaScript enabled. Please enable
在使用vue开发前端项目时,本地接口联调是可以的,但是打包发布到dev上就会报出We're sorry but 'xxx'doesn't work properly without JavaScript enabled. Please enable it to continue.错。原因:nginx文件里面配置的proxy_pass路径有问题,修改为请求后台的接口的路径即可。...原创 2021-07-28 14:54:03 · 3215 阅读 · 0 评论 -
vue设置多个路由文件
1. 在vue的router文件下创建report.js文件2. 在report文件里面设置路由内容3. 回到index.js文件,引入report文件,然后合并路由原创 2021-07-23 11:20:42 · 2074 阅读 · 0 评论 -
vue项目运行报Module not found: Error: Can‘t resolve ‘@/component/TaskCard‘错误
运行vue项目时报Module not found: Error: Can't resolve '@/component/TaskCard'错误原因:App.vue文件引入的路径报错解决方案:修改App.vue文件的引入路径 错误路径: 正确路径:注意:如果修改路径还报错,请删除node_modules文件夹后重新运行 npm install...原创 2021-03-26 14:29:56 · 80424 阅读 · 3 评论 -
vscode快速创建vue文件
1. 打开vscode软件,点击文件>首选项>用户片段2. 输入vue.json后回车3.在vue.json中输入 "Print to console": { "prefix": "vue", "body": [ "<template>", " <div></div>", "</template>", "", "<script>", "export default.原创 2021-03-25 18:21:39 · 3809 阅读 · 0 评论 -
npm run dev运行项目直接卡死,报UnhandledPromiseRejectionWarning: TypeError: loaderContext.getResolve is not a
在搭建vue项目启动项目遇到一个问题,页面直接卡死,重启了好多次都一样,页面报UnhandledPromiseRejectionWarning: TypeError: loaderContext.getResolve is not a function at createWebpackLessPlugin 错误。原因:安装的less-loader版本太高导致,降低less-loader的版本号即可步骤 :1 在控制台面板运行npm uni less-loader 卸载 l...原创 2021-01-26 11:53:51 · 791 阅读 · 0 评论 -
{ parser: “babylon“ } is deprecated; we now treat it as { parser: “babel“ }.
在搭建vue项目时启动报{ parser: "babylon" } is deprecated; we now treat it as { parser: "babel" }.错误原因:prettier版本导致的解决方案:方案1:找到node_modules\vue-loader\lib\template-compiler\index.js文件,把code = prettier.format(code, { semi: false, parser: 'babylon' })修改为cod.原创 2021-01-22 16:09:24 · 767 阅读 · 0 评论 -
vue的props如何传多个参数
vue父作用域将数据传到子组件通过props进行传参,如果需要传多个参数可以数组形式赋值给props,通过这样子组件就可以获取父组件传体过来的多个参数了。<div id="app"> <ul > <todo-item v-for="(item,index) in arr" v-bind:todo="item" v-bind:index="index"&原创 2018-05-10 10:39:27 · 26742 阅读 · 1 评论 -
vue computed的set方法无效怎么办?
vue可以通过set方法将data里面的原始数据改掉,但是为啥监控发现并没有变化,而且set和get打个对调,get输出的值还是不变。原因:默认情况下computed的set方法是不会被执行,只有对重新赋值才会触发computed的set方法。解决方法:只需要对app.fullName进行赋值即可步骤:通过get、set方法对fullName进行赋值,同时在对应的get、set方法里使用conso...原创 2018-05-10 13:39:09 · 19040 阅读 · 2 评论 -
vue-cli打包后运行报路径错误
使用vue-cli打包好的项目放到tomcat下,新建一个目录存打包好的文件,发现报js、css路径错误。解决方案:1.打开config文件夹下的index.js文件,index.js文件有两个assetsPublicPath熟悉,build里面的assetsPublicPath属性,把 assetsPublicPath: '/'修改为 assetsPublicPath: './' 2.改好之后...原创 2018-05-25 16:28:00 · 1158 阅读 · 0 评论 -
vue-cli构建项目如何运行
使用vue-cli构建项目后,在项目目录中,运行命令 npm run dev运行项目,运行成功后会返回一个地址路径。在地址栏直接输入该路径可以看到效果。原创 2018-05-26 14:01:46 · 5436 阅读 · 0 评论 -
v-tetx 如何使用filters
使用vue进行数据处理的时候发现,无法正常在v-text里使用过滤器,可以使用$options.filters让v-text支持过滤器。<div id="app"> <div>默认价格:{{money}}</div> <div>使用过滤器处理显示价格:<span v-text="$options.filters.moneyFilte...原创 2018-05-16 11:51:51 · 320 阅读 · 0 评论 -
vue-cli的使用;如何使用vue-cli搭建项目
vue-cli使用步骤。1.安装node.js;2.安装cnpm。按快捷键Win + r 打开运行对话框,输入cmd后按回车,在弹出的命令对话框中输入 、npm install -g cnpm --registry=https://registry.npm.taobao.org 进行淘宝镜像cnpm的安装;3.安装vue-cli。在命令行窗口中输入 cnpm install vue-cli -g...原创 2018-05-24 13:15:38 · 2019 阅读 · 0 评论 -
安装vue报 npm WARN saveError ENOENT: no such file or directory, open 'F:\test\package.json'错误
在使用npm安装vue时,报npm WARN saveError ENOENT: no such file or directory, open 'F:\test\package.json'错误。 错误原因:项目没有package.json文件导致解决方案:使用 npm init -y 生成默认的package.json文件...原创 2018-10-18 14:55:52 · 17436 阅读 · 0 评论 -
emplate syntax error Component template should contain exactly one root element.
(Emitted value instead of an instance of Error) template syntax error Component template should contain exactly one root element. If you are using v-if on multiple elements, use v-else-if to chain the...原创 2019-06-20 11:19:56 · 1079 阅读 · 0 评论 -
v-for使用报错:Cannot use v-for on stateful component root element because it renders multiple elements.
在使用v-for的时候遇到了这样的错误:Cannot use v-for on stateful component root element because it renders multiple elements. 错误如图:错误代码:<!DOCTYPE html><html> <head> <meta charset="UTF-8">...原创 2018-05-09 17:48:36 · 29261 阅读 · 6 评论