12.Vue+Element UI 获取input的值

一、（表格内直接编辑并取值）

HTML:

　　

<el-table>
　　<el-table-column prop="time" label="日期" ></el-table-column>
　　　　<el-table-column prop="name" label="名称" ></el-table-column>
　　　　<el-table-column prop="pv" label="点击数(PV)"></el-table-column>
　　　　<el-table-column prop="uv" label="去重数(UV)" ></el-table-column>
　　　　<el-table-column prop="num" label="激活/注册/CPS" >
　　　　　　<template slot-scope="{row}">
　　　　　　　　<span v-if="row.num != '-'">{{row.num}}</span>
　　　　　　　　<el-input size="small" v-if="row.num == '-'" v-model="row.date" placeholder="请输入值" type="number"></el-input>
　　　　　　</template>
　　　　</el-table-column>
　　　　<el-table-column prop="operate" label="操作" >
　　　　　　<template slot-scope="scope">
　　　　　　　　<el-button type="primary" class="showSameBtns" @click="historySure(scope.row,scope.$index)" v-if="scope.row.num != '-'" :disabled="true">确定</el-button>
　　　　　　　　<el-button type="primary" class="showSameBtns" @click="historySure(scope.row,scope.$index)" v-if="scope.row.num == '-'" :disabled="false">确定</el-button>
　　　　　　</template>
　　</el-table-column>
</el-table>

 

METHODS:　

　　historySure(res,index){ // 历史记录设置激活数/注册/CPS

　　　　// console.log(res)

　　　　// console.log(index)

　　　　// console.log(histtoryID)

　　　　let params={

　　　　　　name:res.name,

　　　　　　num: res.date

　　　　}

　　　　console.log(params)

　　}

 

二、（Ref：）单个input的值的获取，多个ref为history_Num的input取最后，前值为空

HTML:
　　<input class="edit-cell" v-if="row.num == '-'" ref="history_Num" type="number" style=" 100%;border: 1px solid #c3d4ff;padding: 4px;text-align: center;">

Data中：
　　data(){
　　　　return{
　　　　　　history_Num:'',
　　　　}
　　}

Methods：

　　aa(){

　　　　let num = this.$refs.history_Num.value

　　}