jsx函数式组件中写slot-scope好像不对,报这个错"TypeError: Invalid attempt to spread non-iterable

3,024 阅读1分钟

jsx中怎么使用slot-scopt呢?从网上找了一种写法,但是编译时候会报错"TypeError: Invalid attempt to spread non-iterable instance"

<van-radio slot="right-icon" name={item}>
{...{
     scopedSlots: {
        icon: props => {
            return (
                 <van-icon
                    class-prefix={'iconfont ' + (props.checked ? 'icontubiaosheji_fujiedianxuanzhongfuben': 'icontubiaosheji_weixuanzhongfuben') }
                    color={props.checked ? '#4888F4' : '#333'}
                    name="extra"></van-icon>
                )
            }
        }
    }
}
</van-radio>

如果用Vue写的话是这样的:

<van-radio slot="right-icon" :name="item">
      <van-icon slot="icon"
        slot-scope="props"
        :class-prefix="'iconfont ' + (props.checked ? 'icontubiaosheji_fujiedianxuanzhongfuben':'icontubiaosheji_weixuanzhongfuben')"
        :color="props.checked ? '#4888F4' : '#333'"
        name="extra" />
      </van-radio>

请问用jsx怎么写这段Vue呢?