Vue 与 React 的浅层 PK

包装节点:<template><React.Fragment>

Vue 的 <template> 的子节点只能唯一,遇到多个子节点还要用 <div> 包裹(那你这个 <template> 不就等于多此一举了嘛)。而 React 的 <React.Fragment> 则无限制,更骚的是,人家还能简写 <>,形象又生动。

这一轮,React 胜。

组件状态的内外控制:.sync

很常见的场景,比如一个弹框组件,我可以从外部打开它(比如一个弹框按钮),也可以通过弹框里面的关闭按钮关闭它。

通常我们会这样设计:组件的 visible 完全由外部控制,如果内部想改变 visible 状态,在 React 中我们会给组件添加一个回调方法的参数(通常叫做 onClose),在 Vue 中我们会 emit 一个 update:visible 的事件 ,然后在组件外部完成对 visible 的改变。

这个逻辑没错,也很清晰,但是写起来绕。Vue 提供了 .sync 修饰符帮助处理简化了组件外部的写法(实际上是个语法糖),但是组件内部仍然需要手动 emit。并且,在组件嵌套时,中间组件无法使用 .sync,会涉嫌修改 props,所以还得在中间组件中老老实实手动 emit。这样一来还不如 React 直接透穿参数方便。

这一轮,算 Vue 小胜。

以上是 Vue 与 React 的浅层 PK 的全部内容, 来源链接: utcz.com/z/264588.html

回到顶部