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="width: 100%;border: 1px solid #c3d4ff;padding: 4px;text-align: center;">
Data中:
data(){
return{
history_Num:'',
}
}
Methods:
aa(){
let num = this.$refs.history_Num.value
}