Когда использовать использование Svelte: действие против onMount и onDestroy? - PullRequest
Новая
       12

Когда использовать использование Svelte: действие против onMount и onDestroy?

2 голосов
/ 23 сентября 2019

Если у нас есть что-то вроде Tooltip класса, которому нужно создать экземпляр экземпляра, обновить этот экземпляр и уничтожить этот экземпляр синхронно с моментом монтирования, обновления и уничтожения компонента (как показано в коде ниже),кажется, есть два способа сделать это:

  1. Использование use:action
  2. Использование onMount и onDestroy

use:actionметод кажется более чистым, но помимо этого, есть ли какие-либо принципиальные различия между этими двумя методами, которые бы сделали один предпочтительным по сравнению с другим в определенных ситуациях?

Пример использования use:action: 

<script>
  import Tooltip from './tooltip'

  export let text = ''

  function initTooltip(node, text) {
    const tooltip = Tooltip(node)
    tooltip.text = text
    return {
      update(text) {
        tooltip.text = text
      },
      destroy() {
        tooltip.destroy()
      }
    }
  }
</script>

<div use:initTooltip={text}>
  <slot></slot>
</div>

Пример использования onMount и onDestroy: 

<script>
  import Tooltip from './tooltip'
  import { onMount, onDestroy } from 'svelte'

  export let text = ''

  let node
  let tooltip

  onMount(() => {
    tooltip = Tooltip(node)
    tooltip.text = text
  })

  $: if (tooltip && tooltip.text !== text) {
    tooltip.text = text
  }

  onDestroy(() => {
    if (tooltip) {
      tooltip.destroy()
    }
  })
</script>

<div bind:this={node}>
  <slot></slot>
</div>

1 Ответ

1 голос
/ 24 сентября 2019

Если это поведение, которое вы можете себе представить, когда нужно повторно использовать несколько компонентов, или если вы можете представить, что это то, что вы можете применить к элементу внутри блока {#if ...} (например), то он, вероятно, относится к действию.

Если это что-то, что «принадлежит» самому компоненту, а не конкретному элементу, то, вероятно, это скорее жизненный цикл.

В этом случае моя тенденция, вероятно, будет заключаться в использовании действия.

...