![](https://img-blog.csdnimg.cn/20201217160340989.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
Vue
Vue
_Peko_
这个作者很懒,什么都没留下…
展开
-
【vue启动项目报错】 chunk-vendors.js:1 Uncaught SyntaxError: Unexpected token ‘<‘
原文链接:https://www.tqwba.com/x_d/jishu/5109.html问题描述:某一天启动一个vue项目时,重新 npm install 发现启动的项目报错了chunk-vendors.js:1 Uncaught SyntaxError: Unexpected token '<'app.js:1 Uncaught SyntaxError: Unexpected token '<'解决:将vue.config.js 的 publicPath 是 './',修改为转载 2021-08-30 17:09:29 · 6158 阅读 · 0 评论 -
【vue-cli 的资源放置问题】 Uncaught SyntaxError: Unexpected token ‘<‘
背景项目用的 vue 和 vue-cli 版本“vue”: “^2.6.11”“@vue/cli”: “~4.5.0”我在src的目录下创建了一个static目录,用于存放js和css,然后在代码中调用c.href = '../static/css/he-standard.css';s.src = '../static/js/he-standard.js';运行项目之后发现报错Uncaught SyntaxError: Unexpected token '<'解决把sta原创 2021-06-29 14:43:44 · 110 阅读 · 0 评论 -
【vue-cli、nginx】 vue-cli的环境配置,项目部署、nginx反向代理
vue-cli的环境配置在vue-cli里,区分不同的环境,需要在与src同级的目录下配置以 .env 开头的文件,例如:.env.developmentNODE_ENV = 'development'VUE_APP_MODE = 'dev'VUE_APP_TITLE = '开发环境'VUE_APP_API_URL = '/file-addr'.env.testNODE_ENV = 'test'VUE_APP_MODE = 'test'VUE_APP_TITLE = '测试环境'VU原创 2021-06-15 11:28:56 · 1445 阅读 · 2 评论 -
【axios】 创建自定义请求实例
let instance = axios.create({ methods:'POST', baseURL:'http://localhost:8080', headers:'Content-Type':'application/json', data:{ a:'123', b:'123', },});instance.post('/user/info');原创 2021-04-28 15:31:02 · 557 阅读 · 0 评论 -
【axios】 实现同步调用
async 与await 配置使用实现同步methods: { async funA(){ var res = await axios.post('xxx'); console.log('axios执行完毕才打印'); }}注意:这样的方式只限于使用在axios通信的那一层,如果对axios再包一层函数,然后对这外一层函数使用这样的方式修饰同步,无法实现同步效果吐槽:这样的话。。那不是跟我等响应数据回来再处理一样么。。met..原创 2021-04-20 11:40:18 · 4487 阅读 · 1 评论 -
【vue】 Vue中强制组件重新渲染的正确方法
背景我在写一个模态框的表单时,发现其中所写的下拉框的默认值只生效一次,比如说我默认值是A,然后我下拉选择B,但是我不提交,然后点击关闭模态框,这个时候应该是算我取消了这次的表单填写,当我下次再点击这个模块框出来时,它应该给我显示的下拉框的默认值为A,但是这里就出现了问题,下拉框的值是我上一次选择的B,也就是说这个下拉框并没有重新渲染,默认值只在页面第一次打开时生效解决强制这个组件重新渲染,在每次进入模态框时设置重新渲染,方法主要是给这个下拉框设置一个 :key<a-selec..原创 2021-03-30 14:27:36 · 2125 阅读 · 2 评论 -
【ES6】 Object.assign()
https://www.jianshu.com/p/d5f572dd3776转载 2021-03-25 09:10:38 · 49 阅读 · 0 评论 -
【ant-design-vue】 table表格显示多行数据
例如下面的代码中表示在个人信息栏显示两行数据名字:号码:<a-table :columns="columns"> <span class="level-assess" slot="mySlots" slot-scope="text,record"> 名字:{{record.name}} <br> 号码:{{record.number}} </span></a-table.原创 2021-03-24 09:19:59 · 4661 阅读 · 0 评论 -
【vue,SpringBoot,Mybatis】 关于多条件搜索表单
背景在做小项目的运营后台时,需要制作多条件搜索的表单,要求是:支持任一字段搜索或几个字段的搜索,当无字段搜索时返回所有数据。视图如下在收集表单的数据之后,使用axios发起post请求,代码如下: onSubmit() { let url = this.url.query; let data = new FormData(); data.append('oldFileName',this.form.ol原创 2021-03-17 14:23:39 · 522 阅读 · 0 评论 -
【点击图片另开窗口显示】 img 标签
1、给<img>添加点击事件2、在事件中使用 windos.open(url) 函数,url是图片链接原创 2021-02-26 17:39:40 · 1771 阅读 · 0 评论 -
【ant-design-vue】 </a-card>导致模态框加载出错
背景使用 </a-card> 发现模态框加载出错。什么都没显示,而且父组件也收到影响 <a-card :bordered="false"> <a-modal title="" :width="width" :visible="visible" :confirmLoading="confirmLoading" @ok="handleCancel" okText="确定" @ca原创 2021-03-12 16:46:50 · 2224 阅读 · 0 评论 -
【ant-design-vue】 a-table表头多出来一个空列
背景原因scroll 的 x 设置的长度太长了 <a-table ref="table" size="middle" bordered :columns="columns" :dataSource="dataSource" :pagination="ipagination" :loading="loading" .原创 2021-03-11 17:15:39 · 2819 阅读 · 3 评论 -
【js获取当天时间0点和23点59分59秒】
工具:http://momentjs.cn/使用:let startValue = moment().startOf('day').format('YYYY-MM-DD HH:mm:ss');let endValue = moment().endOf('day').format('YYYY-MM-DD HH:mm:ss');注意://24小时制YYYY-MM-DD HH:mm:ss//12小时制YYYY-MM-DD hh:mm:ss...原创 2021-03-02 10:07:25 · 2060 阅读 · 2 评论 -
Vue子组件调用父组件的方法
Vue中子组件调用父组件的方法,这里有三种方法提供参考第一种方法是直接在子组件中通过this.$parent.event来调用父组件的方法父组件<template> <div> <child></child> </div></template><script> import child from '~/components/dam/child'; export default {转载 2021-03-01 09:09:45 · 563 阅读 · 2 评论 -
【vue】 前端文件下载
<a :href="fileUrl" @click="downloadFile(图片链接)">下载</a> downloadFile(url){ this.fileUrl = url; }原创 2021-02-26 17:54:02 · 104 阅读 · 0 评论 -
【v-for的渲染问题】 this.$refs.xxx 打印出undefined
背景本来我的计划是用v-for来渲染一个标签组的,然后在父组件中使用ref来控制其中每一个标签,完成初始化的工作,然后我在mounted()里使用<input type="text" ref="refName">mounted() { console.log(this.$ref.refName); } 但是运行之后发现打印出了 undefine,所以应该是在mouted()中,v-for还未渲染完成解决:在下一个生命周期中使用refupdated.原创 2021-02-19 11:41:36 · 290 阅读 · 0 评论 -
npm ERR! code EEXIST(文件存在/文件拒绝delete)问题解决
问题在使用npm安装插件的时候,弹出了以下的错误(File exists和 Refusing to delete)$ npm install -g trufflenpm ERR! code EEXISTnpm ERR! path E:\software\nn\node.js\node_global\node_modules\truffle\build\cli.bundled.jsnpm ERR! dest E:\software\nn\node.js\node_global\tru.转载 2021-02-02 14:40:28 · 2285 阅读 · 0 评论 -
【ant-design】 a-table的rowKey出现重复的问题
背景今天在使用ant-design的a-table发生了一件诡异的事情,a-table可以设置数据选中的样式(多选或者单选),我设置为单选的时候,偶然间发现了3条数据竟然是连在一起选中的 然后我右键检查标签,发现他们三条数据的row-key是一样的接着我看<a-table>中是怎么设置row-key的问题就在这,我的数据列中并没有id这个字段,我猜测这个是<a-table>自生成的(不管,先口胡一下。。)解决给r...原创 2021-01-29 16:42:58 · 4192 阅读 · 0 评论 -
【SpringBoot与Vue实现文件上传】 MultipartFile与SysLog冲突(大坑)
html这里用的标签是 ant-design-vue<a-input type="file" @change="upload_photo($event)" accept="image/*"></a-input>js //input触发事件 upload_photo: function(e){ let file = e.target.files[0]; console.log(file);原创 2021-01-27 09:58:14 · 3711 阅读 · 3 评论 -
【axios】 在then的方法中无法获取data数据
背景: axios.post(httpUrl,data).then(function () { console.log('响应'); console.log(response); this.mySource = response; }).catch(function (err) { console.log('失败'); console.log(err); //捕获异常原创 2021-01-19 11:47:52 · 3362 阅读 · 0 评论 -
【axios】 post的使用
首先导入import axios from 'axios'使用 let data = {}; data["payAccountName"] = this.payAccountName; data["payAccountNo"] = this.payAccountNo; data["orderAmount"] = this.orderAmount; data["payDate.原创 2021-01-19 10:23:38 · 650 阅读 · 0 评论 -
【vue】 Error in nextTick: “TypeError: Cannot read property ‘_wrapper‘ of undefined“报错
解决在vue中使用或者绑定不存在的方法,就会报这个错误原创 2021-01-18 15:11:06 · 480 阅读 · 0 评论 -
【vue-cli】 初始化项目文件说明
PS:图片来自 编程不良人转载 2021-01-14 16:12:28 · 91 阅读 · 0 评论 -
【vue】 组件
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script></head><body><!--父组件--.原创 2021-01-14 10:11:34 · 116 阅读 · 0 评论 -
【vue】 生命周期
https://space.bilibili.com/352224540<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Vue的生命周期</title> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js">&l..转载 2021-01-13 15:32:57 · 64 阅读 · 0 评论 -
【axios】 get、post、并发请求的简单使用
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <script src="https://unpkg.com/axi.原创 2021-01-13 14:43:12 · 144 阅读 · 0 评论 -
【vue】 事件修饰符
.stop阻止事件冒泡(当触发当前标签的事件时,也会触发父标签的事件).prevent阻止事件默认行为(链接生效,表单提交).self只触发自身的事件,不监听冒泡(不会触发子标签的事件).once事件只触发一次...原创 2021-01-13 11:37:16 · 40 阅读 · 0 评论 -
【vue】 MVVM架构
MVVM架构又称为双向绑定机制Model Vue实例中绑定的数据 Vm ViewModel(监听器) View 页面数据原创 2021-01-13 11:06:05 · 133 阅读 · 0 评论 -
【vue】 v-model和v-bind:value
区别v-model是双向绑定,v-bind:value只是单向获取数据原创 2021-01-13 10:58:22 · 254 阅读 · 0 评论 -
【element-ui】
首先,创建一个vue项目并初始化1、安装element-ui2、安装sass3、把App.vue中的红框内容删掉------------------明天继续----------------------原创 2021-01-10 20:53:12 · 63 阅读 · 0 评论 -
【vue-router】
首先,创建一个vue项目并初始化1、安装vue-router,在IDEA下面的终端输入npm install vue-router --save-dev有问题就修复2、在main.js中导入vue-router然后,显示声明使用 VueRouter3、创建自己的组件可以看到新建的组件里的<style> 带有一个 scoped (作用域),意思就是当前的样式只能在当前文件生效在App.vue中导入该组件新...原创 2021-01-10 19:48:15 · 179 阅读 · 0 评论 -
【webpack】 初次使用
webpack是一个打包工具首先安装环境1、创建一个空项目2、用IDEA打开(open)3、创建modules文件夹,并在里面创建hello.js文件hello.js//暴露一个方法exports.sayHi = function () { document.write('<h1>Hello</h1>')};然后创建main.jsvar hello = require("./hello");hello...原创 2021-01-10 17:54:01 · 103 阅读 · 0 评论 -
【vue-cli】 HelloWorld
首先安装环境1、然后在命令行提示符里,cd到一个空的文件夹2、创建一个基于webpack模板的vue应用程序vue init webpack myvue一直回车,如果出现(Y/N),就都选N,并回车项目创建完毕,下面是项目文件项目初始化cd myvuenpm install提示修复输入npm audit fix到这里就算把项目初始化完成了,然后用IDEA打开点击,IDEA下面视图栏的终端terminal启动项目...原创 2021-01-10 17:05:56 · 190 阅读 · 1 评论 -
【深入理解vue中的slot与slot-scope】 转载
写在前面vue中关于插槽的文档说明很短,语言又写的很凝练,再加上其和methods,data,computed等常用选项使用频率、使用先后上的差别,这就有可能造成初次接触插槽的开发者容易产生“算了吧,回头再学,反正已经可以写基础组件了”,于是就关闭了vue说明文档。实际上,插槽的概念很简单,下面通过分三部分来讲。这个部分也是按照vue说明文档的顺序来写的。进入三部分之前,先让还没接触过插槽的同学对什么是插槽有一个简单的概念:插槽,也就是slot,是组件的一块HTML模板,这块模板显示不显示、以及转载 2021-01-10 13:07:45 · 78 阅读 · 0 评论 -
【vue】 更改启动端口
在新建的vue工程里,在根目录下新建一个js文件vue.config.jsmodule.exports = { devServer: { port: 8082, // 端口 }, lintOnSave: false // 取消 eslint 验证};然后重新启动项目即可原创 2020-12-17 15:03:42 · 1067 阅读 · 0 评论 -
【vue】 vue中export和export default的使用
https://www.cnblogs.com/fger/p/11994968.html转载 2020-12-15 16:49:49 · 165 阅读 · 0 评论 -
【Vue】 项目环境搭建
安装 node.js :https://nodejs.org/dist/安装yarn:https://www.cnblogs.com/xiaonian8/p/13714285.html安装 vue相关:https://www.jianshu.com/p/1776032fd25a原创 2020-12-15 10:10:34 · 105 阅读 · 0 评论