feat(watchArray): new function

[w1ndy]

Description

This PR adds a new watcher helper watchListChanges. This function monitors the changes made to a list and notifies the callback with the added and removed elements.

Additional context

---

What is the purpose of this pull request?

• Bug fix
• New Feature
• Documentation update
• Other

Before submitting the PR, please make sure you do the following

• Read the Contributing Guidelines.
• Read the Pull Request Guidelines.
• Check that there isn't already a PR that solves the problem the same way to avoid creating a duplicate.
• Provide a description in this PR that addresses what the PR is solving, or reference the issue that it solves (e.g. fixes #123).
• Ideally, include relevant tests that fail without this PR but pass with it.

[w1ndy]

This function is handy when using hooks with v-for:

<div v-for="k in num" :ref="refs.set">{{ k }}</div>

const refs = useTemplateRefsList<HTMLDivElement>()
watchListChanges(refs, (_new, _old, added) => {
    for (let el of added) {
        useEventListener(el, 'click', () => console.log('clicked!'))
    }
}, { deep: true })

[w1ndy]

@antfu Thanks for your feedback, I've renamed this function to watchArray and added two tests for the reactive and functional watch sources. Could you help review again?

[antfu]

Can added and removed also have meta data like [{ value: 4, index: 3 }]?