溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這篇文章將為大家詳細講解有關VUE如何實現無狀態的組件用函數式組件，小編覺得挺實用的，因此分享給大家做個參考，希望大家閱讀完這篇文章后可以有所收獲。
對于一些純展示，沒有響應式數據，沒有狀態管理，也不用生命周期鉤子函數的組件，我們就可以設置成函數式組件，提高渲染性能，因為會把它當成一個函數來處理，所以開銷很低
原理是在 patch 過程中對于函數式組件的 render 生成的虛擬 DOM，不會有遞歸子組件初始化的過程，所以渲染開銷會低很多
它可以接受 props，但是由于不會創建實例，所以內部不能使用 this.xx 獲取組件屬性，寫法如下
<template functional>
<div>
<div class="content">{{ value }}</div>
</div>
</template>
<script>
export default {
props: ['value']
}
</script>
// 或者
Vue.component('my-component', {
functional: true, // 表示該組件為函數式組件
props: { ... }, // 可選
// 第二個參數為上下文，沒有 this
render: function (createElement, context) {
// ...
}
})關于“VUE如何實現無狀態的組件用函數式組件”這篇文章就分享到這里了，希望以上內容可以對大家有一定的幫助，使各位可以學到更多知識，如果覺得文章不錯，請把它分享出去讓更多的人看到。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
