三年 React 開發經驗的我,遷移到 Vue 的心路歷程

import TodoItem from './TodoItem.vue'

export default {

components: {

TodoItem

},

data () {

return {

todo: {

text: 'Learn Vue',

isComplete: false

}

}

}

}

這裡我們要給子組件(TodoItem)傳遞 props,但卻不能在子組件定義的位置傳遞,而必須在模板裡傳遞。相比之下,React 中的 props 傳遞更加自然,是在子組件渲染時完成的:

class TodoList extends React.Component {

render() {

}

}

儘管在 Vue 中傳遞 props 很不方便,但好處是,由於 store 能在任何組件中訪問,實際需要傳遞的 props 比 React 中少得多,而在 React 中,即使有足夠多的容器組件,平均每個組件收到的 props 數量也非常大。

更新:新的 React Context API(https://reactjs.org/docs/context.html)提供了一種在組件樹中直接訪問數據而不需要在每層手動傳遞 props。

三年 React 開發經驗的我,遷移到 Vue 的心路歷程

結論

如開頭所說,本文只是一些我在從 React 遷移到 Vue 時發現的一些最重要的問題。這並不是一篇嚴謹的比較,不能作為選擇庫的依據。但如果你也像我一樣不得不從一個庫切換到另一個庫,或者只是想了解更多的關於兩個庫的信息,這篇文章也許會有幫助。

總結一下重點:

  • Vue 默認不包含 JSX,很強調腳本和模板分離;
  • Redux 和 Vuex 背後的數據流思想很相似;
  • Redux 十分依賴於 state 的不可改變性,而 Vuex 不關心 state 是否不可改變;
  • Vue 允許 dispatch,也允許直接從組件中 commit,但最好還是嚴格些,只允許 dispatch 會比較好;
  • 任何 Vue 組件都可以直接訪問 store。

原文:https://medium.com/@omm2/doing-vue-after-three-years-with-react-3d36d53abbd6

作者:Anya Pavlova,unu GmbH的軟件工程師。

“徵稿啦!”

CSDN 公眾號秉持著「與千萬技術人共成長」理念,不僅以「極客頭條」、「暢言」欄目在第一時間以技術人的獨特視角描述技術人關心的行業焦點事件,更有「技術頭條」專欄,深度解讀行業內的熱門技術與場景應用,讓所有的開發者緊跟技術潮流,保持警醒的技術嗅覺,對行業趨勢、技術有更為全面的認知。

如果你有優質的文章,或是行業熱點事件、技術趨勢的真知灼見,或是深度的應用實踐、場景方案等的新見解,歡迎聯繫 CSDN 投稿,聯繫方式:微信(guorui_1118,請備註投稿+姓名+公司職位),郵箱([email protected])。


分享到:


相關文章: