对比React和Vue中创建应用的区别( 四 ) ReactvsVue：现在有了ReactHooksVu

Vue：在Vue中，我们将道具传递到子组件的创建位置。如：
完成此操作后，我们将它们传递到子组件的props数组中，如下所示：props：[" todo"] 。然后可以通过子组件的名字在子组件中引用这些名字，因此在我们的案例中是todo 。如果您不确定该prop键的放置位置，则这是整个导出默认对象在子组件中的外观：
export default {
name: "ToDoItem", props: ["item"], setup(props, { emit }) {
function deleteItem(id) {
emit("delete", id);
}
return { deleteItem, };
},
};
您可能已经注意到的一件事是，当在Vue中遍历数据时，我们实际上只是遍历了list而不是list.value 。尝试遍历list.value在这里行不通
我们如何将数据发送回父组件？React：首先，通过在调用子组件的地方将其作为道具引用，将函数传递给子组件。然后，通过引用props.whateverTheFunctionIsCalled（如果使用了解构）或whatTheFunctionIsCalled ，可以通过诸如onClick之类的任何方式在子元素上添加对函数的调用。然后，这将触发位于父组件中的函数。我们可以在"我们如何从列表中删除"部分中看到整个过程的示例。
Vue：在子组件中，我们只编写了一个将值返回给父函数的函数。在父组件中，我们编写了一个函数，该函数侦听何时发出该值，然后可以触发函数调用。我们可以在"我们如何从列表中删除"部分中看到整个过程的示例。
我们终于得到它了！我们已经研究了如何添加，删除和更改数据，以道具形式将数据从父级传递到子级，以及以事件侦听器的形式将数据从子级发送到父级。当然， React和Vue之间还有许多其他的小差异和怪异之处，但是希望本文的内容有助于为理解这两个框架如何处理事物奠定基础。
如果您有兴趣分叉本文中使用的样式，并想制作自己的同等作品，请随时这样做！
Github链接到两个应用程序：Vue待办事项：
React待办事项：
最初发布于：sunilsandhu.com
(本文翻译自Sunil Sandhu的文章《I created the exact same app in React and Vue. Here are the differences. [2020 Edition]》，参考：)