在 2.5.0 及以上版本中,如果你使用了单文件组件,那么基于模板的函数式组件可以这样声明:
<template functional> <div class="cell"> <div v-if="props.value" class="on"></div> <section v-else class="off"></section> </div> </template> <script> export default { props: ['value'] } </script>
我们标记组件为 functional
,这意味它是无状态 (没有响应式数据),无实例 (没有 this
上下文)。
提示:函数式组件比普通组件性能更好,缺点是定义的数据没有响应式。