vue在render中写jsx slot-scope内的值如何写?_前端问题_站长_知道

<a-tree>
  <template slot="title" slot-scope="{title}">
    <span v-if="title.indexOf(searchValue) > -1">
      {{title.substr(0, title.indexOf(searchValue))}}
      <span style="color: #f50">{{searchValue}}</span>
      {{title.substr(title.indexOf(searchValue) + searchValue.length)}}
    </span>
    <span v-else>{{title}}</span>
  </template>
</a-tree>

`
例如上面代码事例
由 a-tree组件往slot="title" 向上传了一个title
如果在jsx中怎么写这个slot-scope
`

<a-tree><template slot="title"></template></a-tree>

`
这个slot-scope怎么写才能获取到组件a-tree得到的title?

已解决悬赏分：10 - 解决时间 2021-11-27 05:34

点赞 0反对 0举报 0 收藏 0

回答1

最佳

@zhuxiaohai2004

 const scopedSlots = {
        //defaul 默认具名插槽
        default: props => {
          return (
           // props 就相当于 slot-scope="{title}" 里面的值
            <a onClick={(e) => this.aclick(e, props)}>编辑</a>

          );
        }
      }


return <Table {...{ scopedSlots }}>

      </Table>

支持 0 反对 0 举报

2021-11-26 06:23