vue iview表格单元格可编辑input
方法:/*** 表格内Input组件* @param {function} h // render 内部h函数* @param {object} params表格参数* @param {string/array} prop // params.row[...prop]* @param {function} obj, 可选参数*/// TODO:修改为组件ex...
·
方法:
/**
* 表格内Input组件
* @param {function} h // render 内部h函数
* @param {object} params 表格参数
* @param {string/array} prop // params.row[...prop]
* @param {function} obj, 可选参数
*/
// TODO:修改为组件
export const inTableInputItem = (
h,
params,
prop,
{
changeCall,
blurCall,
type,
numberObj,
disabled,
styles,
badSty,
className,
prepend
}
) => {
let value = params.row
let val = value[prop]
if (typeof prop === "object") {
try {
prop.forEach(key => {
value = value[key]
})
} catch (error) {}
val = value || 0
}
if (disabled) {
return <span>{val}</span>
} else {
let _val = val
if(prepend){
_val = Math.abs(val)
}
if(!blurCall){
blurCall = ()=>{};
}
return (
<Input
value={ _val || ""}
class={className}
v-inputnumber
style="top:0"
onOn-change={changeCall.bind(this, params, prop)}
onOn-blur={blurCall.bind(this, params)}
>
{prepend?<Button slot="prepend" on-click={prepend.call.bind(this, params, prop, val)} icon={val>=0?"md-add":"md-remove"}></Button>:''}
</Input>
)
}
// if (type === "number") {
// if (!numberObj) numberObj = { max: 100000, min: 0, step: 1 }
// return (
// //const {max,max,} = nember
// <InputNumber
// max={numberObj.max}
// min={numberObj.max}
// step={numberObj.step}
// value={val || 0}
// onOn-change={changeCall.bind(this, params, prop)}
// onOn-blur={blurCall.bind(this, params)}
// />
// )
// } else {
// }
// return (
// <Input
// value={val || ""}
// onOn-change={changeCall.bind(this, params, prop)}
// onOn-blur={blurCall.bind(this, params)}
// />
// )
}
/**
* 过滤数值
*/
export const filterNum = val => {
if (isNaN(parseFloat(val))) {
return 0
} else {
return parseFloat(val)
}
}
调用方式:
{
title: '标题',
key: 'tt',
width: 120,
render: (h, params) => {
return inTableInputItem(h,params,'tt',{changeCall:this.ttChange, blurCall: this.blurChange})
}
},
更多推荐
已为社区贡献12条内容
所有评论(0)