![](https://img-blog.csdnimg.cn/20201014180756913.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Vue
lyyo_cd
滴水汇江河。
展开
-
vue-awesome-swiper动态获取数据轮播失效
在vue项目中用vue-awesome-swiper这个插件,我轮播图片一般通过后端获取,循环展示,但会出现循环轮播失效的问题。设置了初始化属性依然无效:原因是循环还没有完的时候swiper组件运行冲突出错导致的,在swiper组件上对数据价格v-if就可以解决。代码如下:...原创 2021-12-01 09:57:36 · 654 阅读 · 0 评论 -
vue路由传参不能直接传对象问题
直接传对象格式不对,需要转换成json格式传:用JSON.stringify()转成json格式,传过去之后用JSON.parse()还原成对象即可需要传参的页面代码:接收到参数后的页面代码(在vue的data()中注册)...原创 2021-11-30 16:24:54 · 1033 阅读 · 0 评论 -
使用vue-awesome-swiper4.1.1不能自动轮播,配置无效
按照官网步骤安装引入使用配置autoplay: true,后发现配置无效,查了无数文档后,终于发现是swiper版本问题swiper版本从7.x降到了5.x:配置写法:原创 2021-11-25 11:14:34 · 796 阅读 · 0 评论 -
cnpm : 无法加载文件解决
cnpm报错 : 无法加载文件 D:\tools\node\node_global\cnpm.ps1。,因为在此系统上禁止运行脚本。解决:在win10 系统中搜索框 输入 Windos PowerShell选择 管理员身份运行执行:get-ExecutionPolicy,显示Restricted,表示状态是禁止的执行:set-ExecutionPolicy RemoteSigned更改权限为:A这时再执行 get-ExecutionPolicy ,就显示RemoteSigned原创 2021-10-18 18:32:07 · 354 阅读 · 0 评论 -
前端面试题总结之vue
注:只是记录我面试时被问到的一些问题,以及本人的简单理解,并不是完全标准答案,也不保证可以作为任何面试参考,如有不准确欢迎指正~说说对vue生命周期的理解 父子组件在生命周期里的执行顺序 自定义组件 怎么进行组件封装 全局过滤器 vue双向绑定 路由传参 keep-alive缓存 组件间传值不定时添加更新内容~...原创 2021-08-20 15:30:37 · 68 阅读 · 0 评论 -
vue--两行代码实现全选功能
数据:方法:changeAll(){ // 全选change事件 // 所有选项状态与全选状态一致 this.items.forEach( item=>item.check = this.checkAll)}changeCur(){ // 单个选项change事件 // 所有选项选中,全选选中,只要有一个不选中,全选不选中 this.checkAll = this.items.every( ...原创 2021-08-02 11:43:18 · 109 阅读 · 0 评论 -
解决使用vue-cli3创建项目时在git下交互提示符没反应问题
vue-cli3下我们使用vue create命令来快速创建项目,在window下会遇到交互提示符不工作的问题,如图所示:vue-cli官网给出了两种解决方法:下面对它们具体实践一下:方法一:第一种比较简单,就是将vue create命令改为winpty vue.cmd create命令,如下图所示:方法二:第二种方法是在~/.bashrc文件中添加以下行来为命令添加别名后执行vue create命令:首先.bashrc这个文件存在于C盘>>用户>&..转载 2020-08-28 14:46:10 · 563 阅读 · 0 评论 -
vue init webpack执行脚本报错
【操作:】node -v v10.15.3;npm -v v6.12.0.;均已达到升级后版本,初始化vue-cli项目,安装cli,vue init webpack xx;【报错:】vue : 无法加载文件 C:\Users\Administrator\AppData\Roaming\npm\vue.ps1,因为在此系统上禁止运行脚本。有关详细信息,请参阅 https:/go.mi...原创 2019-10-11 18:27:32 · 1296 阅读 · 0 评论 -
vue花括号里使用三元运算符(多条判断)
原创 2019-04-09 15:46:35 · 33223 阅读 · 2 评论 -
vue里a标签值解析变量,跳转页面,前面加默认域名端口的问题
let name = 'www.baidu.com/'<a :href="name">点击跳转到:localhost:8080/www.baidu.com/解决:写成<a :href="'https//:'+name">原创 2019-04-11 18:26:18 · 4916 阅读 · 1 评论 -
vue根据接收data中某一个属性,动态添加不同的style样式
1.style动态赋值,利用三元表达式:效果:原创 2019-03-22 12:46:22 · 7019 阅读 · 0 评论 -
Vue-cli项目中,引入css、js或者引入组件,检查后未发现错误,npm红叉报错原因
最近在用vue-cli搭建项目后,正常引入css、js,引入子路由,npm执行都报错,但是代码没问题,检查了很久;下面为报错内容:后知道这是vue中的eslint原因,eslint是语法检查工具,但限制过于严格,大部分开发人员无法适应。找到build文件夹下webpack.base.conf.js;如图,将module下语法检查配置删除,npm run dev重启服务即可:原创 2017-12-01 15:46:16 · 1701 阅读 · 0 评论 -
vue的属性绑定(在引号中绑定)
vue在定义的属性中动态绑定数据,本人用到过两种:首先使用v-bind:XX绑定属性,一、直接定义数据绑定:二、已有内容拼接数据data内数据定义相同,标签内不同原创 2017-12-11 15:04:39 · 10277 阅读 · 0 评论 -
vue项目中,组件里单独引入对应css
我的css文件,放在src文件夹下的assets文件夹下css内。根据你具体的文件路径配置,引入在当前页面路径下的css(不是在main.js里引入,main.js引入是公共css与js,之前文章有在main.js引入步骤)...原创 2018-05-17 16:24:48 · 18521 阅读 · 0 评论 -
vue.js的h5页面与android(WebViewJavascriptBridge) / ios(window.webkit.messageHandlers)交互详细
一、首先是h5页面与android交互:这里,我交互的android用的是WebViewJavascriptBridge:####android调用h5方法并传递消息:注意:在vue与android交互的时候,android的方法里this指向无效,需要赋值that;#### h5传递消息给android:二、h5页面与IOS交互,这里IOS用的是window.webk...原创 2018-11-20 16:43:58 · 43242 阅读 · 6 评论 -
Vuejs快速获取input的值
一,使用$.ref来标识元素,代码:点击submit方法,this.$ref. 获取内容; 二,使用v-model双向绑定点击submit,this.upTitleArea获取内容,注意:v-model需要在data内声明,才能this获取 ...原创 2018-11-28 16:00:53 · 24111 阅读 · 1 评论 -
vue项目中,判断限制input=file上传文件的类型及大小
vue-cli项目中,使用input=file上传附件,判断文件格式是否正确,在change事件里进行判断:类型:大小:let extName = files[0].name.substring(files[0].name.lastIndexOf(".")).toLowerCase();let AllUpExt = ".rar|.zip|.doc|.docx|.xls|....原创 2019-03-20 15:43:23 · 8933 阅读 · 1 评论 -
(vue)解决input[type='file']上传相同附件只传一次问题
js解决方法:HTML:<input id="file" type="file" onchange="upload()" />JS:document.getElementById('file').value = null;VUE逻辑:<inputref="referenceUpload"@change="referenceUpload"type="file"...原创 2019-03-20 15:48:57 · 4066 阅读 · 0 评论 -
vue-cli+axios实现文件上传下载(下载接收后台返回文件流)
vue-cli+axios实现附件上传下载记录:上传:这里用formData格式传递参数;请求成功后后台返回上传文件的对应信息。重点是下载:##############downloadfile(res) {var blob = new Blob([res.data], {type: 'application/vnd.openxmlformats-officedocume...原创 2019-03-18 17:36:27 · 6751 阅读 · 2 评论 -
Vue-cli项目中引入外部/第三方css/js/less文件具体步骤
例子中css文件采用bootstrap.css,js文件采用jQuery,less文件用less.less(自定义文件);步骤一:安装webpackcnpm install webpack -g步骤二:在src/assets下面新建css、js、less、fonts文件夹,并放入对应文件。将bootstrap.css放入css目录下,bootstrap.min.转载 2017-12-01 14:18:46 · 9053 阅读 · 0 评论