
vue
个人学习vue的一些记录
陈仙生
这个作者很懒,什么都没留下…
展开
-
vue调用百度定位接口实现地理定位
其实HTML5中有个 Geolocation API 可以获得用户的地理位置,不过它只能返回用户位置的经度和纬度。下面是一个简单示例:var x=document.getElementById("demo");function getLocation() { if (navigator.geolocation) { navigator.geolocation.getCurrentPosition(showPosition); } else {.原创 2020-10-25 17:36:59 · 3111 阅读 · 6 评论 -
vue+node+mysql实现用户注册上传头像
首先祝大家1024程序员节节日快乐!写篇博客记录一下这个特别的节日!相信有很多小伙伴写用户管理系统的项目都想实现这样一个功能,就是用户注册可以上传自己的头像,然后把用户信息和头像一起写入数据库,当用户登录成功后可以显示当前用户的头像。我能想到的第一个方法是先把用户选择的图片通过base64转码,然后把用户信息和转码后的一大串字符串一起写入数据库,用户登录成功后再取出来并交给img标签解析。这个方法的缺点也很明显,性能肯定是大打折扣的,而且转码后的文件会占用很多存储空间,无法存储大图片。第二个办法就是原创 2020-10-24 18:23:08 · 2638 阅读 · 2 评论 -
vue2使用axios请求报错Cannot set property ‘axios‘ of undefined
今天使用axios请求时突然报了个错:之前用的好好的,怎么今天就突然报这样的错了呢!细心的同学应该发现了,vue-axios已经升级到3.0版本了,还记得上个月新发布的vue3吗,随着vue3的更新,vue-axios也升级了,大家可以看看官网的介绍 vue-axios最新的vue-axios3仅支持最新的vue3,所以解决方法就是安装旧版本的vue-axios:1.卸载vue-axiosnpm remove vue-axios2.重新安装旧版本的vue-axiosnpm install原创 2020-10-15 20:31:44 · 2084 阅读 · 2 评论 -
vue-cli4+element-ui搭建知乎项目及总结
花几天时间和小伙伴做了个仿知乎官网的项目,下面是我整理的项目搭建流程及部署和总结,如有不足之处欢迎大家批评指正!先奉上项目地址和源码!源码地址 , 项目地址一、目录结构本项目使用vue-cli4脚手架创建,目录结构也比之前的2版本要简洁许多,下面是本项目的目录结构。1.public文件夹下的data和found放的是json数据和图片资源,本来想直接调用知乎的数据接口,奈何没有权限,于是只好将json数据保存在本地了~2.assets放的也是图片资源3.components放的是一些组件,.原创 2020-09-28 17:46:27 · 1037 阅读 · 0 评论 -
Chrome浏览器安装Vue Devtools插件(附带编译好的工具包)
我们在使用vue开发项目的时候,如果想要更好的审查和调试 vue 应用,可以使用官方推荐的Vue Devtools。但是官方的方法比较麻烦,要使用npm编译,搞不好还会报好多莫名其妙的错误。下面给大家提供一个简便的方法,不会再浪费大家宝贵的时间啦!1.获取Vue Devtools插件我已经将编译好的插件上传到博客里啦,可以找一下然后下载。解压后得到一个 vender 文件夹,打开后目录结构如下打开 manifest.json文件,找到 "persistent”,将它的值改成true2..原创 2020-09-09 23:47:17 · 3535 阅读 · 3 评论 -
vue-admin-template使用路由和mockjs进行二次开发
最近在研究vue-admin-template模板,准备对他做二次开发,其中必须要经历的步骤就是创建路由和请求mock假数据了,下面是我写的一个商品页面,所有的数据都是利用Mockjs随机生成的,现在简单说一下我的编写步骤和思路。如果对这个模板不熟悉的话建议先阅读一下官方文档1.首先我们在views下新建一个product文件夹,然后在里面新建一个index.vue,官方文档说了,侧边栏是动态生成的,所以我们只需要在路由表里添加一个路由2.进入router/index.js,添加一个路由,我把它当原创 2020-05-30 19:34:22 · 3620 阅读 · 5 评论 -
vue使用axios请求easy mock假数据
我们前端开发项目的时候有时需要用到一些数据,以便我们查看页面效果或者检查接口是否可用,本篇文章教大家如何使用axios去请求假数据!原创 2020-05-28 13:50:48 · 1046 阅读 · 2 评论 -
使用 element-ui 隐藏组件 el-scrollbar 美化滚动条
嘻嘻,抽空出个教程,这个我也是看别人的文章学来的哈哈拿element-ui官网的这个container布局容器做例子吧,当我们展开所有条目的时候,右侧就会出现浏览器自带的滚动条,而且这个滚动条还会把左边的上下箭头挤过去…说白了就是会占间距,虽然还看得过去…但是给别人的感觉就很low然后我们再把鼠标移动到官网左侧的列表栏,就能看到element-ui自带的滚动条啦,很好看吧那么我们怎样才能用上这个滚动条呢,教程开始!element-ui是有这个组件的,<el-scrollbar>&l原创 2020-05-26 14:40:45 · 3952 阅读 · 0 评论 -
对vue响应式原理的理解
我们都知道,vue 最独特的特性之一,是非侵入性的响应式系统,数据模型仅仅是普通的 JavaScript 对象,而当我们修改它们时,视图会进行更新,其实就是让组件重新渲染。那么 vue 是怎样追踪到数据的变化并重新渲染组件的呢,看看官网的解释:当你把一个普通的 JavaScript 对象传入 Vue 实例作为 data 选项,Vue 将遍历此对象所有的 property,并使用 Object.defineProperty 把这些 property 全部转为 getter/setter。Object.def原创 2020-05-25 11:32:54 · 550 阅读 · 0 评论 -
解决vue-cli 项目引入element ui 运行时浏览器报错Unknown custom element
解决vue-cli 项目引入element ui 运行时浏览器报错Unknown custom element上条动态的问题解决了,在main.js文件里加入下面的代码即可import Vue from 'vue';import App from './App';import router from './router';import ElementUI from 'element-ui';import 'element-ui/lib/theme-chalk/index.css';Vue原创 2020-05-23 21:18:27 · 3059 阅读 · 0 评论 -
关于 idea 安装 Vue 插件后新建文件不显示 Vue Component 的问题及解决方法
关于 idea 安装 Vue 插件后新建文件不显示 Vue Component 的问题及解决方法1.点击 file 打开设置 settings,展开 Editor 找到 file and code templates2.找到 Vue single file component 并选中它,然后点击copy3.复制后底部出现了一个新的文件4.把 Name 改成 Vue Component,然后把代码里的 “COMPONENT_ ”删掉,最后点 ok 就完事了然后我们再新建一个文件的时候就可以看原创 2020-05-21 19:53:31 · 5672 阅读 · 31 评论