React vs Vue in 2020

React vs Vue in 2020

技术选型

React

// UserProfile.jsx
function UserProfile({id, showAvatar, onFollowClick}: {
  id: string,
  showAvatar: boolean,
  onFollowClick: () => void,
}) {
  const [user, setUser] = React.useState(undefined);
  React.useEffect(() => {
    fetchUser(id).then(setUser);
  }, [id]);
  return (
    <div>
      <div>{id}</div>
      {showAvatar ? <Avatar id={id} /> : null}
      {user !== undefined ? <UserBody user={user} /> : null}
      <button onClick={onFollowClick}>Follow</button>
    </div>
  );
}

Vue

// UserProfile.vue
<div>
  <div>{{ id }}</div>
  <Avatar v-if="showAvatar" :id="id" />
  <UserBody v-if="user" :user="user" />
  <button @click="$emit('follow-click')">Follow</button>
</div>
defineComponent({
  props: {
    id: { type: String },
    showAvatar: { type: Boolean },
  },
  setup(props) {
    const {id} = toRefs(props);
    const user = ref(undefined);
    function updateUser() {
      fetchUser(id.value).then(data => {
        user.value = data;
      });
    }
    onMounted(updateUser);
    watch(id, updateUser);
    return {user};
  }
})

结论

如果您是正确性和爱情类型系统的忠实拥护者（我就是其中之一），您可能会更喜欢React。它与TypeScript搭配使用效果更好，并且语言方法更纯正。

Vue具有全局名称空间（尽管您可以避免使用它），但是自定义事件，插件和mixins之类的功能具有JS的动态特性。

出于这个原因，我希望有许多工程师在大型代码库中的复杂应用中使用React。

如果您喜欢从HTML /静态内容开始并大量使用JavaScript的想法，那么您可能会喜欢Vue的模板方法。

对于不熟悉JavaScript的开发人员，Vue可能更容易上手。

模板是直观的，可以逐步采用。您无需考虑重新渲染，数据绑定很容易理解。

这并不是说您无法使用Vue构建复杂的应用程序。如果您花费大量时间在JavaScript上，您可能会喜欢React的更纯净的语言方法。

最后，很难忽视React的大规模采用和庞大的生态系统。对于公司而言，React是风险较小的选择。

具有React经验的工程师要多于Vue的经验。招聘可能会更容易。此外，还有更多其他的React渲染目标（如React Native）可能会有用。

归根结底，您可以同时使用两个框架。我个人仍然更喜欢React，但我不能说它绝对更好。

refs

https://bypaulshen.com/posts/comparing-vue-and-react/

---

---

xgqfrms 2012-2020

www.cnblogs.com 发布文章使用：只允许注册用户才可以访问！

---