element-ui

vue-cli3集成element-ui:
1. vue create demo
2. vue add element
3. src\plugins\element.js   设置全局插件
4. views中页面按需引入

import {Row, Col, Dialog, Tabs, TabPane, Form, FormItem, Input,Message } from 'element-ui'
export default{
name: 'About',
components:{
　　[Row.name]:Row,
　　[Col.name]:Col,
　　[Dialog.name]:Dialog,
　　[Tabs.name]:Tabs,
　　[TabPane.name]:TabPane,
　　[Form.name]:Form,
　　[FormItem.name]:FormItem,
　　[Input.name]:Input,
　　[Message.name]:Message
}

 

常见问题
1、EL-Table获得选中的行

<el-table ref="singleTable"/>

多选： this.$refs.multipleTable.store.states.selection
单选： this.$refs.summaryTable.store.states.currentRow

2、el-table 多选改单选
<el-table-column
label="操作"
width="55">
　　<template slot-scope="scope">
　　　　<el-checkbox v-model="scope.row.checked"></el-checkbox> 
　　</template>
</el-table-column>

handleSelectionChange (row) {
　　this.tableData3.forEach(item => {
　　　　// 排他,每次选择时把其他选项都清除
　　　　if (item.id !== row.id) {
　　　　　　item.checked = false
　　　　}
　　　})
　　console.log(row)
}

3、el-input type="textarea"    设置高度

     :rows="5"