Vue.js
Micah_A
to be a better swifter
展开
-
Vue.js 入门
Vue简介Vue官网:https://cn.vuejs.org/ Vue.js是是一套构建用户界面的渐进式框架,它让你通过简单灵活的API创建有数据驱动的UI组件。与其他重量级框架不同的是,Vue 采用自底向上增量开发的设计。Vue 的核心库只关注视图层,它不仅易于上手,还便于与第三方库或既有项目整合。 Vue.js是一款轻量级的 以数据驱动构建web界面的前端JS框架,他在架构设计上采用了MV原创 2017-11-28 00:20:43 · 896 阅读 · 0 评论 -
基于better-scroll封装slider组件
前言轮播图可以说是在开发中必不可少的组件。接下来这篇文章就基于better-scroll封装一个简单的slider。better-scroll简介better-scroll可以说是在Vue开发移动端中最好用的滚动视图的组件,基本上可以解决移动端各种滚动场景需求,核心是借鉴了iscroll的实现,而且API设计基本兼容iscroll.如果您想详细的了解,可以点击查看better-scro原创 2018-02-02 16:43:48 · 1730 阅读 · 0 评论 -
Vue.js 常用插件
better-scroll:移动端非常好用的滚动组件 npm install --save better-scrollaxios:Vue官方推荐网络请求框架npm install axiosfastclick:解决移动端的点击延迟问题npm install fastclick -Svuex:vue.js的状态管理器npm install vuexjs原创 2018-01-17 09:35:42 · 2276 阅读 · 0 评论 -
Vue2.0 封装axios
简介在开发中,网络请求是不可或缺的一部分。在之前的Vue2.0中官方推荐使用axios作为网络请求插件,取消对 vue-resource 的官方推荐。下面就介绍一下,我们在开发中axios的使用。简单使用GET请求axios.get('/user?ID=12345') .then(function (response) { console.log(response);原创 2018-01-22 16:42:48 · 5152 阅读 · 0 评论 -
VUE-CLI脚手架热更新没有效果
在开发中使用VUE-CLI脚手架构建项目后,使用webstorm进行开发时,偶尔会出现修改后的页面没有及时reload. 我们需要在webstorm取消勾选stystem settings下的use save write”。1、进入偏好设置2、修改配置3、保存修改即可原创 2018-01-02 22:46:40 · 6037 阅读 · 1 评论 -
Vue 2.5.2下 axios + express 本地请求404
最近在学习Vue,今天尝试了使用axios模拟本地网络请求。使用的过程中发现接口请求一直404,后来发现在当期的Vue-cli构建的最新的项目中,接口请求应该这样写。1、引入相关依赖var axios = require('axios')const express = require('express');var app = express();var apiRoutes = express.原创 2018-01-02 16:44:46 · 2201 阅读 · 3 评论 -
在stylus格式的图标字体里url无法解析
问题最近在使用Vue开发时 使用了icmoon生成的字体图标,但是引入项目文件后一直报错。我尝试了使用stylus引用、CSS引用 都不可以。解决方式后来尝试把font资源放在static文件下,使用绝对路径访问就可以了。 之前卡在这个地方好久,因为我反复的检测测试过 本地项目的css loader 、stylus loader 等都是配置可以的,但是每次报的都是路径的访问问题,后来偶然看到了这原创 2017-12-17 18:08:05 · 1889 阅读 · 0 评论 -
Vue2.0 使用vue-resource 模拟网络请求加载本地数据
1、首先我们需要在webpack.dev.conf.js中const PORT = process.env.PORT && Number(process.env.PORT) 的后面追加一下代码:const express = require('express');const app = express();const appData = require('../data.json');con原创 2017-12-07 22:33:38 · 2796 阅读 · 0 评论 -
vue-cli 引入 stylus 失败
在使用Vue构建webpack模板后代码中使用stylus报错:<style lang="stylus" rel="stylesheet/stylus"></style>解决方案一、 安装相关的loadernpm install stylus stylus-loader style-loader --save-dev在webpack.base.conf.js的module的loaders里加入了原创 2017-12-06 23:54:49 · 676 阅读 · 0 评论 -
vue init webpack myproject构建项目 ip不能访问
问题vue init webpack myproject构建项目 使用localhost 或者127.0.0.1 均可以正常访问,但是切换到本地ip就不行了解决方式在 webpack.dev.conf.js 追加以下代码const HOST = process.env.HOST || '0.0.0.0';重新启动npm run dev重新打开即可原创 2017-12-08 23:55:50 · 1445 阅读 · 0 评论 -
Mac Vue.js 安装并初始化项目
Vue简介官网推荐安装方式 https://cn.vuejs.org/v2/guide/installation.html安装Node.js请参照之前的配置RN环境安装Homebrew请参照之前的配置RN环境全局安装Vue# 全局安装 vue-cli$ npm install --global vue-cli 解决方式:权限问题 命令加上sudo即可# 全局安装 vue-cli$ sudo原创 2017-11-28 22:07:45 · 1014 阅读 · 0 评论 -
Vue2.0 实现滚动视图+头部悬停+侧边索引
前言之前写过一篇基于better-scroll实现轮播图组件的文章,这篇文章是对better-scroll封装后,实现一个类似于通讯录的UI.效果如下:需求分析根据需求,我们可以知道,整个UI大致分为三个模块。 1、头部导航 2、内容滚动区域 3、索引列表区域代码实现1、首先我们对better-scroll进行一个简单的封装,方便我们下文的使用scroll.v原创 2018-02-04 22:50:51 · 7508 阅读 · 0 评论