Vue.js 2.0 由浅入深,第五天 day05

## 一、 准备工作

###1. 初始化项目

vue init webpack itany

cd itany

cnpm install

cnpm install less less-loader -D

cnpm install vuex axios -S

npm run dev

### 2. 项目资源

|-reset.css

|-data.json

### 3. 创建目录结构

首先清除项目中的部分内容

创建如下目录结构:

|-data.json

|-static

|-css

|-reset.css

### 4. 配置API接口,模拟后台数据

使用express框架启动一个Node服务器,配置API接口,模拟后台数据

测试API:

http://localhost:8080/api/seller

http://localhost:8080/api/goods

http://localhost:8080/api/ratings

## 二、项目整体结构开发

时间: 2024-10-03 23:28:58

Vue.js 2.0 由浅入深,第五天 day05的相关文章

Vue.js 2.0 由浅入深,第一天 day01

### Vue.js 五天 *汤小洋* ## 一. Vue.js简介 ### 1. Vue.js是什么 **Vue.js**也称为Vue,读音/vju:/,类似view,错误读音v-u-e 版本:v1.0 v2.0 + 是一个构建用户界面的框架 + 是一个轻量级MVVM(Model-View-ViewModel)框架,和angular.react类似,其实就是所谓的数据双向绑定 + 数据驱动+组件化的前端开发(核心思想) + 通过简单的API实现**响应式的数据绑定**和**组合的视图组件**

Vue.js 2.0 由浅入深,第三天 day03

## 一. 组件component ### 1. 什么是组件? 组件(Component)是 Vue.js 最强大的功能之一.组件可以扩展 HTML 元素,封装可重用的代码 组件是自定义元素(对象) ### 2. 定义组件的方式 方式1:先创建组件构造器,然后由组件构造器创建组件 方式2:直接创建组件 ### 3. 组件的分类 分类:全局组件.局部组件 ### 4. 引用模板 将组件内容放到模板<template>中并引用 ### 5. 动态组件 <component :is="

Vue.js 2.0 由浅入深,第四天 day04

## 一.模块化开发 ### 1. vue-router模块化 cnpm install vue-router -S #### 1.1 编辑main.js #### 1.2 编辑App.vue #### 1.3 编辑router.config.js ### 2. axios模块化 cnpm install axios -S 使用axios的两种方式: 方式1:在每个组件中引入axios 方式2:在main.js中全局引入axios并添加到Vue原型中 ### 3. 为自定义组件添加事件 ## 二

Vue.js 2.0 由浅入深,第二天 day02

## 一. 发送AJAX请求 ### 1. 简介 vue本身不支持发送AJAX请求,需要使用vue-resource.axios等插件实现 axios是一个基于Promise的HTTP请求客户端,用来发送请求,也是vue2.0官方推荐的,同时不再对vue-resource进行更新和维护 参考:GitHub上搜索axios,查看API文档 ### 2. 使用axios发送AJAX请求 #### 2.1 安装axios并引入 npm install axios -S 也可直接下载axios.min.

更轻更快的Vue.js 2.0与其他框架对比(转)

更轻更快的Vue.js 2.0 崭露头角的JavaScript框架Vue.js 2.0版本已经发布,在狂热的JavaScript世界里带来了让人耳目一新的变化. Vue创建者尤雨溪称,Vue 2.0 在性能上有显著的提升,同时保持轻量的文件下载: 渲染层基于一个轻量级的Virtual DOM实现进行了重写,该Virtual DOM实现fork自snabbdom.新的渲染层相比v1带来了巨大的性能提升,也让Vue 2.0成为了最快速的框架之一. 根据1.0到2.0迁移指南,“大约90%的API是相

Vue.js 2.0 参考手册.CHM下载

下载地址 Vue.js 2.0 参考手册.CHM下载链接: http://pan.baidu.com/s/1kVbhd4b 密码: wxfh

Vue.js 2.0版

Vue.js 2.0版升级,更改了好多方法或指令 new Vue({ el:'#demo', data:{ msg:"vue2.0" } }) v-model lazy number debounce (2.0版废弃)  新加 lazy .lazy - 取代 input 监听 change 事件 .number - 输入字符串转为数字 .trim - 输入首尾空格过滤 <input v-model.lazy="msg" /> v-for v-for迭代语

【翻译】Vue.js 2.0 教程 起步

第一次在博客园上翻译东西,因为现在还没有中文的Vue.js2.0文档,很多英语不好的同学就郁闷了.以后有时间就翻译一些,不过等我翻译完,官方中文文档肯定就上线了......大家可以打开英文原网站,因为里面有些例子可以直接演示. 官方英文文档链接 正文: 起步 什么是Vue.js? Vue(发音类似view)是一个紧跟时代潮流的框架,为构建用户界面而生.不同于其他庞大的框架,Vue的设计是从底层向上逐步递增的(译者附:刚开始使用Vue不需要太多依赖).Vue的核心库不仅仅聚焦于视图层,它还非常容易

Vue.js 2.0 学习重点记录

Vue.js兼容性 Vue.js.js 不支持 IE8 及其以下版本,因为 Vue.js.js 使用了 IE8 不能模拟的 ECMAScript 5 特性. Vue.js.js 支持所有兼容 ECMAScript 5 的浏览器. Vue.js安装 安装方式有两种: 1.直接下载用script标签引入(推荐引入开发版本,压缩版本会失去错误提示和警告) 2.使用cdn方法引入 3.npm安装 npm安装的前提需要安装了nodejs,这里推荐nvm安装nodejs 附上一小段nvm使用的命令: $ n