![](https://img-blog.csdnimg.cn/20210420155019746.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
vue
文章平均质量分 79
vue的常规方法介绍
人生一串儿
全栈开发工程师。可独立开发后台管理系统、pc、移动端商城、APP、熟练使用nodejs连接数据库开发接口;主要技术栈react,nodejs,angular,vue,nextjs;微信、支付宝小程序,taro;运维:了解linux。熟练使用nginx;
展开
-
移动端如何实现横向和纵向都滚动,better-scroll实现横向和纵向双向滚动
因项目需要,要实现横向和纵向双向滚动的功能,自己手写了一个结果ios和android不兼容。。。后来发现大神的better-scroll可以实现,但也是频频踩坑,这几个配置间有冲突,搞不好还不能实现双向滚动,结果要加班,哈哈那接下来就总结一下我实践成功的方法,先看效果图开始讲解环境和版本这个是在vue中自己封装的组件"vue": "^2.5.2","better-scroll": "^1.15.2",组件<template> <div> &l原创 2020-07-23 16:30:23 · 1567 阅读 · 0 评论 -
vue创建全局组件
前置工作:在src/components中新建quanju文件夹,再创建quanju.vue, index.jsquanju.vue<template> <div>全局组件</div></template><script> export default { name: 'quanju', data () { return {} } }</script><style>原创 2020-05-27 10:20:48 · 145 阅读 · 0 评论 -
vue打包时配置生产环境的接口
这里写自定义目录标题效果图方法1.配置config/prod.env.js2.处理axios的baseURL3.处理接口api效果图先看效果图,打包后在dist中打开index.html可以看到,访问接口是正确的。方法1.配置config/prod.env.jsmodule.exports = { NODE_ENV: '"production"', API_HOST: '"http://www.puduoduo.com/api.php?s="'}2.处理axios的baseURL原创 2020-07-31 15:08:50 · 1891 阅读 · 0 评论 -
vue-axios系列:axios拦截器,配置请求头,配置请求参数
这里写目录标题axios拦截器配置请求头在这里插入图片描述拦截器添加参数-方法1拦截器添加参数-方法2axios拦截器配置请求头request.interceptors.request.use( config => { /** * 处理请求头 * 1.token 2.防刷短信 */ if(token){ config.headers.Authorization= JSON.parse(token) } //防刷短信(pdd) co原创 2020-07-24 16:34:00 · 6328 阅读 · 0 评论 -
vue-axios系列:封装axios
实验一下,每天两篇,记录日子,将来在写文章 2020-7-23原创 2020-07-24 16:25:15 · 90 阅读 · 0 评论 -
vue定义全局函数,以及在自定义js文件中引入ui库的功能
开发时将常用的函数放到一个js文件中,作为全局函数随时使用,很方便新建文件util.jsexport default { toast: function(txt){ alert(txt) }, ....}在main.js中将其设置为全局函数// 全局函数import util from './util/util.js' // 导入api接口Vue.prototype.$util = util; // 将api挂载到vue的原型上使用methods: { cl原创 2020-07-23 23:19:20 · 545 阅读 · 0 评论 -
在Vue中使用echarts,简单使用,组件化使用分析
在Vue中使用echarts安装版本依赖使用使用 -(全局引入)使用-(按需引入)在项目中不可避免的需要对数据进行可视化处理,也就是用图表展示,就把之前常用的echarts拿来分析一下,先看下效果好了,下面进入主题安装npm install echarts -S版本依赖"vue": "^2.5.2","echarts": "^4.8.0",不写版本依赖的都是耍流氓(版本不对导致出错的案例罄竹难书呀)使用使用 -(全局引入)在main.js中// 引入echartsimpor原创 2020-07-23 09:58:55 · 1308 阅读 · 0 评论 -
vscode设置vue模板
vue需要频繁的新建组件,每次都要手敲一大堆代码不胜其烦,这么复杂的做事不符合风流倜傥的我呀,我就想能不能设置个模板,就像使用hubuild编辑器一样方便像上图这样,它不香吗?现在就手把手教大伙这个小窍门(举一反三可以写各种模板哈)1.选择菜单里的 文件 > 首选项 > 用户代码片段2.点击新建全局代码(我喜欢创建新东西,哈哈),然后输入vue-demo 再回车3.VSCODE会自动打开一个文件,复制以下内容到这个文件中"Print to console": {原创 2020-07-09 14:43:26 · 1364 阅读 · 0 评论 -
vue中引入图片的方法
例如我得图片位置在src/common/image中,现在想在放在页面中,发现在vue中要引入图片还真是个麻烦事,比angular麻烦多了1.html中引入<img :src="imgurl('recommend/banner1.jpg')" alt="">export default { data() {}, methods: { //通用方法,这里直接找到公共图片文件夹 imgurl (name){ // 大家根据自己的路径,修改下边的写法原创 2020-07-08 14:33:07 · 4716 阅读 · 0 评论 -
vue中swiper vue-awesome-swiper的使用方法和爬坑大法
vue中swiper vue-awesome-swiper的使用方法和爬坑大法由版本引起的一系列坑坑1坑2坑3正确的使用姿势:安装(指定版本)组件中使用由版本引起的一系列坑时间:2020.07.08(时间,版本很重要-坑的起源)这两天在vue中使用swiper做轮播图,就随手百度了一下,找个帖子开始参考(坑开始了)按照图中的方法,原计划5分钟搞定,一顿操作猛如虎,然后vue各种报错,然后再各种百度,结果开始了2天的爬坑之旅![在这里插入图片描述](https://img-blog.csdnimg.原创 2020-07-08 13:33:33 · 83680 阅读 · 124 评论