![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Vue.js
Vue.js学习
奋斗鱼
一个人如果没有梦想,那跟咸鱼有什么区别
展开
-
Vue:打包app运行后出现Loading chunk chunk** failed.报错
问题:用Hbuilder打包app项目,运行后控制台出现Loading chunk chunk** failed.报错,图片加载不出来,点击导航页面无法跳转。控制台出现Loading chunk chunk** failed.的报错提示。解决方案将路由的mode属性改为hash。重新编译运行后,问题解决。...原创 2022-02-27 22:56:52 · 4726 阅读 · 0 评论 -
Vue.js:json的使用
json字符串转换成json对象 let res = JSON.parse(jsonstr); //jsonstr 为json格式的字符串 console.log(res);原创 2022-02-09 22:18:32 · 842 阅读 · 0 评论 -
vue.js:基于nodejs使用log4js输出日志文件
一、问题开发web项目过程中,常规的console.log()只是将信息反映在了浏览器的控制台,我们经常需要输出到文本日志文件,以便开发调试和维护排查。下面介绍log4js在vue项目中的部署与使用。二.解决方案1.安装log4j// 注意:如果只执行npm install XXX,没有指定安装到那种环境下的“后缀”,就会发现node-modules中安装了,但是package.json中没有的情况。// 1、保存到开发依赖(devDependencies):npm install原创 2021-11-29 23:14:01 · 9623 阅读 · 14 评论 -
Vue:使用qs序列化插件
qs插件具有一些附加安全性的querystring解析和字符串化库1.安装npm install qs2.引用如果全局引用,可以在main.js中:import qs from 'qs';Vue.prototype.$qs = qs //使用时用this.$qs即可3.qs.stringify()qs.stringify()是将对象序列化成URL的形式,以&进行拼接var Lk = {year: '2021',month: '01'};qs.str.原创 2021-11-25 23:35:26 · 400 阅读 · 0 评论 -
如何修改Vue在node命令启动方式的端口号
Vue 2.x在config文件夹中有一个index.js其中部分内容如下,port即为端口号Vue 3.x在Vue 3.x中修改端口号则需要在项目根目录下创建一个vue.config.js,内容如下。module.exports = { devServer:{ port:8081 }}...原创 2021-10-24 22:07:07 · 2510 阅读 · 0 评论 -
Vue:动态加载img或href等变量地址(html代码加载动态参数)
在html动态加载img的src参数方法html部分代码<div class="avatar"><img :src="vurl" alt=""></div>js部分代码export default { name: "index", data() { return { name: "index", vurl:"#",//跳转地址 }; }}...原创 2021-08-02 10:39:25 · 837 阅读 · 0 评论 -
Vue:Error: PostCSS received undefined instead of CSS string
问题出现这样的报错提示,一般是安装的node-sass有问题,用cnpmp执行重新指定安装node-sass,然后在npm install就正常了。我安装的版本是4.14.1解决方案cnpm install node-sass --save-devnpm installnpm run serve如果你报错“Error: Node Sass version 5.0.0 is incompatible with ^4.0.0.”,就先卸载掉,然后重新安装n.原创 2021-07-20 09:37:16 · 3990 阅读 · 0 评论 -
Vue.js:引入自己的js工具类文件
1.创建自己的公用工具类文件comm.jsimport moment from 'moment';var comm = { //将时间转为格式字符串 dtStr:时间字符串或timeStamp,formatstr:如YYYY-MM-DD HH:mm dateTimeFilter:function(dtStr,formatstr) { return new Date(dtStr).format(formatstr) },};export default comm;2.在v原创 2021-07-10 19:05:40 · 637 阅读 · 1 评论 -
Vue.js:日期时间格式化
1.日期时间带T和Z的Json格式字符串例:2021-07-08T17:43:33.000Zvarts= createTime.split("T");varsub=ts[1].substring(0,8);//17:43:33console.log("格式化后::"+ts[0]+""+sub); //2021-07-08 17:43:332....原创 2021-07-10 11:17:45 · 578 阅读 · 1 评论 -
Vue.js:字符串操作
let str = 'abcaadef';1.截取字符串str.substring(2);//截取第二个之后所有的字符 caadefstr.substring(2,4);//截取第二个到第四个之间的字符 ca2.替换字符串str.replace("a","b") ;//只替换第一个匹配子串 输出bbcaadefstr.replaceAll("a","b") ;///替换所有匹配子串输出bbcbbdef...原创 2021-07-10 10:53:34 · 2061 阅读 · 0 评论 -
Vue:安装less编译报错:Module build failed (from ./node_modules/less-loader/dist/cjs.js)
采用vue cli 4x 脚手架开发vue2 项目时 在安装了 less和less-loader 后,编译项目的时候提示下面问题:Module build failed (from ./node_modules/less-loader/dist/cjs.js): TypeError: this.getOptions is not a function经过搜索了解是less-loader的版本太高了当前是8解决方式,降低less-loader的版本为7.3.0npm install less..原创 2021-06-04 23:03:41 · 3088 阅读 · 2 评论 -
VScode:关闭eslint语法检测限制
在VScode中,eslint的校验可以来规范开发人员的代码。但是有些像缩进、空格、空白行之类的规范,在开发过程中一直报错,也很烦,现在介绍如何关闭eslint校验。点击文件-》首选项-》设置-》扩展,选择ESLint,将enable选项值修改为false,即可。...原创 2021-05-18 19:37:14 · 3865 阅读 · 0 评论 -
VS Code:结合Chrome浏览器在VS Code进行断点调试
VS Code:结合Chrome浏览器在VS Code进行断点调试1.在根目录的vue.config.js文件中,确定项目运行的端口,如果你没有设置,系统运行时会默认给一个端口比如8080module.exports={publicPath:process.env.NODE_ENV==='production'?'':'/',devServer:{port:8082}}此处8082为项目启动端口2.在根目录的packag...原创 2021-05-17 17:23:57 · 1662 阅读 · 0 评论 -
Vue.js:前端下载静态资源文件
以下介绍不通过调用后端接口,直接在前端点击链接实现下载资源文件的方式。1.把文件放到指定静态资源目录如把文件**.exe放到public-->static下,public目录下的文件是外部可以直接访问的。2.页面添加下载标签<a :href="`${downloadUrl}/static/WebComponentsKit.exe`" target="_blank" style="color:#FF0000;text-decoration:underline" >...原创 2021-04-21 10:18:27 · 6791 阅读 · 0 评论 -
Vue:获取html的控件值
HTML代码<input type="text" ref='myedit' />Vue代码var tt= this.$refs.myedit.value;console.log(tt);原创 2020-07-23 16:41:16 · 1871 阅读 · 0 评论 -
Vue:Element-UI 弹出窗口el-dialog使用iframe加载外部页面内容
想要实现如下效果在页面中点击链接,弹出窗口,窗口中加载指定的页面内容1.vue文件内容html部分的代码 <el-dialog title="提示" :visible.sync="dialogVisible" width="80%" height="100%" :before-close="handleClose" > <iframe src="http://www.baidu.com"原创 2020-07-03 16:23:17 · 24869 阅读 · 3 评论 -
JS:向对象如{aa:123}动态添加成员(Vue Element 表格批量删除功能)
JS对象可以按如下方式添加let params={};params["bb"]=2;params["cc"]=3;Element 表格批量删除功能中,需要动态获取勾选行的主键ID值,前端表格定义html代码如下: <el-table :data="users" border class="table" ref="multipleTable" @selection-change="han.原创 2020-06-28 19:02:11 · 1002 阅读 · 0 评论 -
Vue:使用axios发送post请求,后台springmvc无法正常获取数据的解决方法
在Vue框架中,使用axios提交数据问题前端js代码如下:import Vue from 'vue'import axios from 'axios';let baseUrl = '/sys';export const getAddUser = params=>{ return axios.get('user/addSave',{params:params});}后台java代码如下: @RequestMapping(value = "/addSave", m原创 2020-06-28 16:00:03 · 711 阅读 · 0 评论 -
Vue:Element-UI的表单验证出现validate is not function错误解决方法
前端使用Vue框架,并用Element UI组件库搭建管理系统按照官网的demo,表单html代码如下 <!-- 新建用户 --> <el-dialog title="新建用户" :visible.sync="addUserVisible" ref="addUserForm" v-dialogDrag> <el-form :model="addUserForm" :rules="addUserRule">原创 2020-06-28 15:44:30 · 21294 阅读 · 2 评论 -
Vue.js:使用脚手架Vue CLI安装与部署(结合Element UI组件库搭建前端框架)
Vue.js安装1.安装node.js需要安装node环境,下载地址https://nodejs.org/en/。以下命令均是在CMD命令行工具中在执行。安装完成后,输入node -v和npm -v,正常能显示版本号。C:\Users\quan>node -vv12.18.1C:\Users\quan>npm -v6.14.52.安装cnpm由于npm的资源在国外,安装下载其他库时会很慢,可以通过安装cnpm,使用国内的淘宝镜像源。npm in...原创 2020-06-19 17:59:29 · 471 阅读 · 0 评论