拆分computed的颗粒度

• Vue
• 组件中数据源头就是一个个ref或Vue 响应式对象
• 但由于组件中各种逻辑的需要，需要对这些数据源进行一些处理，处理的中间产物（或最终渲染结果），保存为computed
• 而一个computed中的一些数据可能需要被Vue watch监听或其他用途，则需要把computed进行拆分，即一个computed引用上一层computed

实例

const visibleWindow = computed(() => {
  const start = (currentPage.value - 1) * pageSize.value
  const end = start + pageSize.value
  return { start, end }
}) // 从pagedApps中拆出来的
 
const pagedApps = computed(() => {
  const { start, end } = visibleWindow.value
  return appRows.value.slice(start, end)
}) // 实际渲染到页面上
 
watch(visibleWindow, () => {
  fetchUnloadedVisibleDetail()
})