分类：Vue

2020
11-10

如何在vue 中引入使用jquery

1.首先在配置文件中添加cnpminstall 下载jquery文件2.在webpack配置文件中添加下面代码3.接着在webpack.base.conf.js中module.exports的最后加入下面代码4.最后在main.js中全局引入5.引入完成以后重启项目，就可以在全局使用jquery了以上就是如何在vue中引入使用jquery的详细内容，更多关于vue引入使用jquery的资料请关注自学编程网其它相关文章！... 继续阅读 >
2020
11-10

Vue + ts实现轮播插件的示例

背景最近在学习ts，打算用ts写一个练手项目，参照的网站内容是wanandroid，这个接触过android开发的同学可能更i了解一些，其实一开始是打算后台全部都自己写的，不过奈何一个懒字，所以现在的打算就是自己实现登录注册简单的逻辑。这些都不重要，一开始实现轮播是打算在vue中引入轮播图swiper.js，后来想想还是自己写算了。也当作熟悉ts。先上效果图(这里没有动态图片，各位同学可以自己实现)代码已经上传git，进度比较慢... 继续阅读 >
2020
11-10

Vue + ts实现轮播插件的示例

背景最近在学习ts，打算用ts写一个练手项目，参照的网站内容是wanandroid，这个接触过android开发的同学可能更i了解一些，其实一开始是打算后台全部都自己写的，不过奈何一个懒字，所以现在的打算就是自己实现登录注册简单的逻辑。这些都不重要，一开始实现轮播是打算在vue中引入轮播图swiper.js，后来想想还是自己写算了。也当作熟悉ts。先上效果图(这里没有动态图片，各位同学可以自己实现)代码已经上传git，进度比较慢... 继续阅读 >
2020
11-10

vue router返回到指定的路由的场景分析

vue router返回到指定的路由的场景分析 项目场景：项目场景：示例:A(商品详情)——B(商品购买页面)-C(支付成功页面)——D(订单页面）问题描述：提示：这里描述项目中遇到的问题：如果我们不做控制的话，安卓按照浏览器返回机制，依次从D-C-B-A这样子,这样子会有一定的bug,测试那边也是说不过去啊，原本想利用beforeRouteLeave这个来操作进行更改跳转，发现还是有点问题最后还是用beforeRouteEnter来操作了，先放上两个的区别吧：这里先介绍一下导航守卫>beforeRouteEnte... 继续阅读 >
2020
11-10

vue实现动态给id赋值,点击事件获取当前点击的元素的id操作

：id绑定:id="‘a_'+index"输出的id为a_0，a_1。。。。。<divv-for="(item,index)inlist":key="index"><div:id="'a'+index"@click="b(index)">哈哈哈</div></div>然后在vue的实例中就可以拿到对应的idb(index){this.list.splice(index,1);}或<div@click="open($event)"id="1">添加<div>open(a){console.log(a.currentTarget.id)//1}补充知识：Vue中怎么动态的去插入DOM节点呢？问题描述：排除数据的插入方式，... 继续阅读 >
2020
11-10

vue实现动态表格提交参数动态生成控件的操作

上面要求做一个根据后台数据动态生成控件，然后让用户输入提交查询信息，然后动态生成表格在显示出来。动态控件代码如下<el-form:model="formData"style="padding:05px;"><divv-if="tableshow"><divv-for="(item,i)incontrol":key="i"style="padding-left:10px;float:left"><el-form-itemv-if="item.type=='input'":key="item.name":prop="item.name"label-width="100px">... 继续阅读 >
2020
11-10

vue实现标签云效果的示例

闲扯两句最近想给自己的博客上加上一个3D标签云的效果，用来表示自己博客文章的分组，网上找到了canvas实现的，还有a元素实现的解析3D标签云，我想让标签可以选择和点击，又不想在标签数量较多时操作a标签导致性能问题，于是svg就成了一个不错的选择。标签初始化这里实现的核心主要是参考了前面的那篇解析3D标签云的文章，作者给出了源码，讲解也比较通俗易懂。大体来说，整个代码分三步：根据标签的数量，算出每个标签在球面上... 继续阅读 >
2020
11-10

写一个Vue loading 插件

作者：imgss出处：http://www.cnblogs.com/imgss什么是vue插件?从功能上说，插件是为Vue添加全局功能的一种机制，比如给Vue添加一个全局组件，全局指令等；从代码结构上说，插件就是一个必须拥有install方法的对象,这个方法的接收的第一个参数是Vue构造函数，还可以接收一个可选的参数，用于配置插件：varmyplugin={install:function(Vue,options){...}}从意义上来说，正如jQuery的$.fn使jQuery有了一个庞大的生... 继续阅读 >
2020
11-10

解决Vue大括号字符换行踩的坑

解决Vue大括号字符换行踩的坑 最近遇到这样一个问题，在页面上要显示一段自定义的文本，文本如果较长的话需要换行显示。在HTML中可以通过<br/>标签换行，也可以通过\n转义字符换行在Vue中用大括号显示的变量，加<br/>会直接被当成字符串显示出来，加\n显示一个空格，加\r\n显示两个空格，因为{{}}}是文本插值，内部都会按照普通字符串进行处理，可以用v-html进行显示如下显示name变量data(){return{name:'前一部分<br/>后一部分'}}在元素上显示name值... 继续阅读 >
2020
11-10

vue data有值,但是页面{{}} 取不到值的解决

我的问题出在js引入的顺序不对，导致不能正常显示vue中的值正确的顺序应该是：先引入vue的js--------html代码-----最后引入自己写的js补充知识：vue中子组件的created、mounted生命周期钩子中获取不到props中的值问题父子组件通信这个很简单，父组件中使用v-bind绑定传送，子组件使用props接收即可。例如：在父组件中<template><div><div:Data="Data"></div></div></template><script>data(){return{Data:[10,20,3... 继续阅读 >
2020
11-10

vue 防止页面加载时看到花括号的解决操作

如下所示：<style>[v-cloak]{display:none}</style>v-cloakv-textv-htmlv-cloak用于大段v-text用于单个标签v-html用于带有标签的处理补充知识：vue花括号数据绑定不成功的问题我就废话不多说了，大家还是直接看案例吧~<!DOCTYPEhtml><html><head><metacharset="utf-8"/><title></title></head><scriptsrc="js/vue.js"type="text/javascript"charset="utf-8"></script><!--引入vue--><scriptsrc="... 继续阅读 >
2020
11-10

解决vue初始化项目一直停在downloading template的问题

解决vue初始化项目一直停在downloading template的问题 解决方法如下：用powershell初始化vue项目一直停留在downloadingtemplate用git的gitbushhere就可以了。补充知识：vueinitwebpack卡在chromedriver上问题解决办法最近在学习vue，尝试利用vue-cli创建一个工程。但是执行vueinitwebpackprojectname时，执行到Savingtoc:\Users\......\chromedriver_win32.zip时卡住不往下走了。仔细看downloading的连接，果然是被墙了的google网址。只能找国内的地址了。后来网上查，很... 继续阅读 >
2020
11-10

在VUE中使用lodash的debounce和throttle操作

说明：debounce和throttle在脚手架的使用，此处以防抖函数debounce为例避免按钮被重复点击引入：importlodashfrom'lodash'使用：直接使用debounce方法//审核audit:lodash.debounce(function(){this.$refs['model'].saveTotalResult(1).then(()=>{constreportId=this.activeReport.id;report.audit(reportId).then(res=>{successMsg(res.msg)})})},300)补充知识：在Vue中使... 继续阅读 >
2020
11-10

解决vue init webpack 下载依赖卡住不动的问题

解决vue init webpack 下载依赖卡住不动的问题 有时候下载依赖的时候网速不行，这时候我们选择手动下载依赖有时候下载依赖的时候网速不行，这时候我们选择手动下载依赖：选择No,Iwillhandlethatmyself生成完项目之后，再cd进入项目文件夹，然后再npminstall安装即可。但是如果真的安装“个把”小时也没成功那就用：cnpminstall吧如果安装过程中等待太久，我们难免会不耐烦，所以会中途关闭项目。那么我们接下操作npmrundev肯定是报错的正确做法：cd进入项目文件夹... 继续阅读 >
2020
11-10

vue 解决在微信内置浏览器中调用支付宝支付的情况

vue 解决在微信内置浏览器中调用支付宝支付的情况 我的思路大概是这样的1.验证是否是在微信内置浏览器中调用支付宝2.给支付页面的url加上调用接口所需的参数（因为在微信里是不能直接调用支付宝的需要调用外部浏览器）3.在外部浏览器中完成支付跳转页面第一步：payment:是选择支付页面，pay-mask是用于在微信内置浏览器中调用支付宝的中间页payment主要代码：letua=window.navigator.userAgent.toLowerCase()ua.match(/MicroMessenger/i)=="micromessenger"这两句代码就是判... 继续阅读 >
2020
11-10

详解Vue中的watch和computed

前言对于使用Vue的前端而言，watch、computed和methods三个属性相信是不陌生的，是日常开发中经常使用的属性。但是对于它们的区别及使用场景，又是否清楚，本文我将跟大家一起通过源码来分析这三者的背后实现原理，更进一步地理解它们所代表的含义。在继续阅读本文之前，希望你已经具备了一定的Vue使用经验，如果想学习Vue相关知识，请移步至官网。Watch我们先来找到watch的初始化的代码,/src/core/instance/state.jsexportfunct... 继续阅读 >