组件的使用细节点--is、ref、props特性、校验

本文介绍了Vue组件中的一些关键点,包括:使用`is`属性解决特殊场景下的组件渲染问题,如在`ul`或`select`中使用组件;通过`ref`直接访问子组件或DOM元素,以及在组件上使用`ref`获取组件实例;详细阐述了组件参数`props`的校验规则,强调了不能直接修改props传递的值,但可以通过拷贝使用;最后讨论了`props`特性的重要性,以及不正确使用非`props`属性可能出现的错误情况。
摘要由CSDN通过智能技术生成

1. is属性
当在一些特地搭配的标签中用到组件时,如在ur标签里用到组件,但是ul有些标签搭配限制如搭配 li /ol,这时若用的是<xxx组件名>在页面中不会显示,那么可用is来解决,即< li is=“xxx组件名” >,select里的标签只能是option,但是需要用到组件,也可以用is来解决。

<tbody>
<tr is="row组件名"></tr>
</tbody>

2. 组件的refs
当要在JS中直接访问子组件,可以使用ref, eg:< 组件名 ref=“名字xx”>;也可以用ref来标明DOM元素如: < li ref=“xx名字”>;
这样在JS中可以使用 this.$refs.xx名字来直接访问DOM元素或者组件。
当在组件上使用ref,那么this.$refs.名字 获取到了组件实例,可以使用组件的所有方法。

3. 组件参数校验
:对于父组件传递给子组件的任意类型的参数,子组件利用props接收后,在子组件的实例中不可以直接对齐做更改,但是可以将该参数进行拷贝,拷贝后参数值就作为子组件属性值
在这里插入图片描述
子组件可以要求父组件传递的参数类型。在props中声明参数类型。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值