2019年8月27日
Vue项目中mock模拟数据
摘要： 新的vue-cli生成的项目中build文件夹中已经没有dev-server.js这个文件 被替换成了webpack-dev-conf.js文件 因此只需要在这个文件中配置mock数据即可: 我们使用的是express这个框架起的服务，所以可以使用express-router来编译这些接口请求: 在 阅读全文
posted @ 2019-08-27 16:08 日暮途远i 阅读(306) 评论(0) 推荐(0)
2019年8月11日
Vue使用better-scroll----城市组件实现字母联动选择
摘要： https://www.cnblogs.com/rmty/p/11040799.html 在之前通过Better-scroll实现了城市选择页面最基本的功能，接下来把这个页面字母表联动的过程记录一下： 要实现的效果： 1.点击右侧字母表，页面移动到对应城市字母开头的地方 2.手指在右侧字母表上滑动， 阅读全文
posted @ 2019-08-11 16:51 日暮途远i 阅读(1057) 评论(0) 推荐(0)
2019年6月20日
使用Vue实现购物车功能
摘要： 要实现的效果如图下 遍历循环data中购物车的数据渲染到页面上，产品的所有字段，购买的数量，以及单价 先遍历直接能用的数据： 接着对购物车产品数量表单进行双向数据绑定,给左右按钮加一个点击事件使用三元表达式判断当前产品数量进行累加或者递减 通过单价*数量绑定总金额： 接下来给产品列表，每一项添加一个 阅读全文
posted @ 2019-06-20 09:52 日暮途远i 阅读(2857) 评论(0) 推荐(0)
2019年6月17日
Vue项目中使用better-scroll
摘要： 要实现如下效果 使用npm安装better-scroll 准备一个city.jsonMOCK数据里面返回了从A到Z的城市 和首页数据获取一样，引入axios获取城市数据 把数据分发到子组件中： 子组件接受数据并循环: 效果完成: 阅读全文
posted @ 2019-06-17 17:07 日暮途远i 阅读(658) 评论(0) 推荐(0)
2019年6月16日
vue项目中使用axios发送ajax
摘要： 首先使用npm安装axios: 安装好后可以去package.json中查看相关依赖 在HOME.VUE中引入axios 在static目录下新建一个文件夹mock，在里面存放各种模拟数据 定义一个获取首页数据的方法，把获取到的数据打印出来 获取成功: 在本地测试的时候需要使用mock数据，但是在正 阅读全文
posted @ 2019-06-16 10:55 日暮途远i 阅读(702) 评论(0) 推荐(0)
2019年6月12日
在VUE的项目中使用字体图标以及Stylus
摘要： 字体图标可以从阿里巴巴的矢量图标库里下载: https://www.iconfont.cn/collections/index?spm=a313x.7781069.1998910419.4&type=1 比方说我需要一个搜索图标，可以把其先添加到购物车 在项目里可以把添加过去的icon下载下来 下载 阅读全文
posted @ 2019-06-12 15:34 日暮途远i 阅读(2394) 评论(0) 推荐(0)
Vue在使用组件中的一些需要记住的点
摘要： 1.这样的写法会因为HTML的规则tbody里只能有tr，td标签而解析错误 正确的写法如下： 同理select下也只能有option,ul里只能有li，要使用组件也可以使用类似的方法 2.子组件需要绑定数据情况需要把数据作为一个函数返回 会报错： 正确写法： 3.使用ref可以获取到VUE实例下面 阅读全文
posted @ 2019-06-12 09:30 日暮途远i 阅读(195) 评论(0) 推荐(0)
给微信小程序添加简单小动画
摘要： 需要实现的效果很简单，当微信小程序跳转到该页面时，微信登录BUTTON从右往左淡入出现，手机登录BUTTON从左往右淡入出现，类似于animation.css的简单效果 官方文档上是这样说的： ①创建一个动画实例 animation。 ②调用实例的方法来描述动画。 ③最后通过动画实例的 export 阅读全文
posted @ 2019-06-12 09:29 日暮途远i 阅读(3368) 评论(0) 推荐(0)
微信小程序封装wx.request方法
摘要： wx.request的官方文档,具体如何使用官方文档里已经写的很明白了: https://developers.weixin.qq.com/miniprogram/dev/api/network/request/wx.request.html wx.request是一个异步的方法,所以请求数据之后s 阅读全文
posted @ 2019-06-12 09:28 日暮途远i 阅读(19775) 评论(0) 推荐(2)
2019年6月11日
Vue简易动画实现和使用animate.css库
摘要： 简单使用动画方法： 使用keyframes动画帧 自定义Clss名字: 通过自定义CLASS可以方便的使用一些动画库，比如animate.css 在Vue中使用js动画库,在这里使用velocity这个js库 给多个元素添加动画： 给组件添加动画也一样 给列表添加动画过度效果，只需要把transit 阅读全文
posted @ 2019-06-11 13:04 日暮途远i 阅读(1074) 评论(0) 推荐(0)