![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue
木子Leo
阻挡自己的只有自己筑起的墙。
展开
-
vue H5与(Android、iOS)原生APP交互
一:JS调用APP1、封装公共方法:/** *js调用APP * @params {*} Obj 传给app参数 */export function JSToNativeAPP(params) { let isAndroid = navigator.userAgent.indexOf('Android') > -1 || navigator.userAgent.i...原创 2019-12-23 15:03:26 · 2675 阅读 · 0 评论 -
Vue渲染富文本图片点击预览
1.渲染富文本:使用Vue提供的 v-html 进行富文本内容渲染<div v-html="content" @click="imageChgange($event)"></div>2.获取点击元素,点击图片预览绑定点击事件,传入 $event 参数 //ImagePreview Vant组件库图片预览组件 ima...原创 2019-10-19 16:13:45 · 3601 阅读 · 0 评论 -
Vue.js结合Canvas制作二维码和图片的合成(html2canvas + Canvas2Image)--整理
之前写过一篇关于二维码和图片合成的博文,但是存在一些问题,本篇是本人整理最后在项目中使用的。建议:如果是单张背景图或者是多张背景图且二维码在同一位置的话,建议直接在后台合成分享图直接给前端返回即可,我这次项目需求是多张背景图并且二维码的位置都不同,后台不方便处理,所以直接前端来处理了。需求背景:分享图片,图片中含有自己分享链接生成的二维码!!大体思路:第一步、将自己的分享码或...原创 2019-03-18 20:40:40 · 6482 阅读 · 3 评论 -
vue input输入框关键字筛选检索列表数据展示
想必大家在项目开发中难免会用到关键字筛选的功能,正好这次项目有需求要做这一块,就整理一下vue的input输入框输入关键字检索数据列表的代码。下面直接上代码:html:<!-- 筛选demo --><template> <div> <input type="text" v-model="search"> ...原创 2019-01-24 17:43:13 · 24698 阅读 · 7 评论 -
vue2+axios 请求拦截器及路由拦截器封装(笔记)
axios依赖安装:npm install axios -S 新建axios文件夹-> baseUrl.js & index.js & router.js main.js 引入//axios封装import './axios' js介绍:baseUrl.js:baseUrl.js 简单区分开发环境、测试环境及生产环境 ,之前有篇文章已经介绍 ...原创 2018-12-07 11:26:05 · 5086 阅读 · 2 评论 -
vue之img标签:src地址拼接 --随记
背景:图片为本地资源,根据后台返回的icon(图片名字/标记)匹配本地图片。代码:(假数据)<template> <div> <ul class="gift_main_list" v-if="tabIndex == 1"> <li class="list_item" v-for="(it原创 2018-12-13 17:32:59 · 35689 阅读 · 14 评论 -
vue之menu弹出菜单效果
先上效果图,这个项目的github可以看一看从上图中,我们可以看出界面主要分为menu和item2块,其中menu的动画是自传,item的动画是位移,然后这里我们通过绝对布局的方式将整个控件定位在四个角落。.menu_container { position: absolute; z-index: 100; border-radius: 50%; tr...转载 2018-11-16 09:58:31 · 4723 阅读 · 1 评论 -
vue2结合qrcanvas生成二维码
一. npm安装 npm install qrcanvas二. 在用的页面引入import { qrcanvas } from 'qrcanvas';三. html<div id="qrcode" ></div>四.scriptthis.$nextTick(()=> { var canvas = qrcanvas({ ...原创 2018-11-08 18:45:33 · 1400 阅读 · 0 评论 -
Vue.js结合Canvas制作二维码和图片的合成(qrcanvas + html2canvas)
(这个有问题,最近会把整理后的更新上去!!!!!!)最新最新!!!:https://blog.csdn.net/zuorishu/article/details/88632978需求背景:分享图片,图片中含有自己分享链接生成的二维码!!大体思路:第一步、根据自己的分享链接生成一张二维码; 第二步、结合一张图片合成带分享二维码的大图;开干:首先来生成二维码,之前都是使用...原创 2018-11-09 10:38:57 · 17441 阅读 · 11 评论 -
vue2+elementUI+i18n 国际化语言切换实现
vue-i18n github:https://github.com/kazupon/vue-i18nvue-i18n安装: npm install vue-i18n --save1.src目录下新建i18n文件夹>看下图2. cn.js代码import zhLocale from 'element-ui/lib/locale/lang/zh-CN' //引入elem...原创 2018-08-15 18:29:51 · 13722 阅读 · 12 评论 -
vue2+axios项目简单区分开发环境、测试环境及生产环境以加载不同域名
在main.js 或者你自己配置的api.js中使用,原理:根据获取到的URL的主机名 来判断是开发环境或测试环境或正式环境,来设置不同的baseUrllet baseUrl = '';if (location.hostname == '***') { //测试环境 baseUrl = '***';} else if (location.hostname == '*****')...原创 2018-08-07 17:12:00 · 4258 阅读 · 1 评论 -
vue-cli 项目在IE内核兼容配置参考
问题一:页面内容不显示解决方法:在index.html页面添加如下代码<meta http-equiv="X-UA-Compatible" content="IE=edge" />问题二:语法错误解决办法:下载安装babel-polyfillnpm install babel-polyfill --save然后在main.js引入 import 'ba...原创 2018-08-07 16:07:42 · 1862 阅读 · 0 评论 -
vue+elementUI表格关键字筛选高亮
代码:<template> <div class=""> <div class="top"> <!-- 筛选 --> <div class="screen"> <div style="width:30%&原创 2018-07-03 15:33:34 · 9807 阅读 · 8 评论 -
vue使用elementUI的el-input监听回车事件
由于elementUI对input进一步进行封装,直接@keyup.enter是没有响应的。使用方法是在事件后面脚上.native<el-input type="password" v-model="form.pwd" @keyup.enter.native="submitForm()" placeholder="Please enter your password"></el-...原创 2018-07-16 15:14:00 · 18115 阅读 · 0 评论