vue 因为使用scope后选择器和标签出现[data-v

使用scope的以后出现datd-v,例如:

<div data-v-2311c06a class="button-warp">
    <button data-v-2311c06a class="button">text</button>
</div>
.button-warp[data-v-2311c06a]{
    display:inline-block;
}
.button[data-v-2311c06a]{
    padding: 5px 10px;
    font-size: 12px;
    border-radus: 2px;
}

去掉scope的之后data-v就会消失

转载于:https://www.cnblogs.com/ToBeBest/p/9621580.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
在iview的Table组件中添加日期选择器和Input输入框可以通过iview的template模板语法来实现,可以参考以下代码: ```html <template> <Table :columns="columns" :data="data"> <template slot-scope="{row, column}"> <div v-if="column.key === 'date'"> <DatePicker :value="row[column.key]" type="date" @on-change="onDateChange(row, column.key, $event)" /> </div> <div v-else-if="column.key === 'input'"> <Input v-model="row[column.key]" @on-change="onInputChange(row, column.key, $event.target.value)" /> </div> <div v-else> {{ row[column.key] }} </div> </template> </Table> </template> <script> import { Table, DatePicker, Input } from 'view-design' export default { components: { Table, DatePicker, Input }, data() { return { columns: [ { title: '日期', key: 'date' }, { title: '内容', key: 'input' }, { title: '备注', key: 'remark' } ], data: [ { date: '2021-08-01', input: '示例1', remark: '备注1' }, { date: '2021-08-02', input: '示例2', remark: '备注2' } ] } }, methods: { onDateChange(row, key, value) { row[key] = value }, onInputChange(row, key, value) { row[key] = value } } } </script> ``` 这里使用iview的DatePicker组件来选择日期,使用Input组件来输入内容,通过在Table组件的template插槽中添加DatePicker和Input组件,可以将选择器和输入框添加到表格的每一行中。 注意,在onDateChange和onInputChange方法中,需要将选择器选中的日期值或输入框输入的值赋值给对应的行数据属性,这样才能实现选择器和输入框的同步更新。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值