具体实战 - b13wen/vue.js-study GitHub Wiki

1、project - staticweb

2、安装vue脚手架工具 npm i -g cnpm --registry=https://registry.npm.taobao.org

npm i -g vue-cli vue -V 脚手架安装完成后，初始化包结构,继续输入 vue init webpack demo

yes no no no

启动 npm run dev

3、安装iview npm install --save iview

4.在main.js中加入iview import iView from 'iview' import 'iview/dist/styles/iview.css' // 使用 CSS Vue.use(iView)

5、创建login.vue 在iview中找到表单组件 6、修改App.vue 加入组件

import Login from '@/components/Login' export default { name: 'App', components: { 'Login': Login }, data() { return {} } }

7、安装axios npm install axios -S

在main.js中加入代码
import axios from 'axios'
Vue.prototype.$axios = axios

8、引入自定义组件 由于app.vue中 会扫描全部的router 所以导入自定义组件就将组件导入 到router中就行

<script> import Login from "../pages/system/Login"; export default { name: 'HelloWorld', data () { return { msg: 'Welcome to Your Vue.js App' } }, components: { Login } } </script> <style scoped> h1, h2 { font-weight: normal; } ul { list-style-type: none; padding: 0; } li { display: inline-block; margin: 0 10px; } a { color: #42b983; } </style>

username # avataar 头像 userPhoto type 消息类型 # content 消息内容 # id 接受者id

⚠️ **GitHub.com Fallback** ⚠️