feat(useFileDialog): add listener for file change events

[Alfred-Skyblue]

Warning: ⚠️ Slowing down new functions

Due to the growing audience of VueUse, we received a huge amount of feature requests and pull requests. It's become harder and harder and recently a bit beyond our capacity to maintain the project. In the near future, we could like slowing down on accepting new features and prioritize the stability and quality of existing functions. New functions to VueUse may not be accpected. If you come up some new ideas, we advice you to have them in your codebase first instead of proposing to VueUse. You may iterate them a few time and see how them suite your needs and how them can be generalized. If you really believe they are useful to the community, you can create PR with your usercases, we are still happy to hear and discuss. Thank you for your understanding.

Description

Add listener for file changes.

I need to trigger some operations when files change at work, and currently I can only monitor its changes through watch, which is a bit cumbersome for me, so I added an onChange method in this PR for monitoring The changes in files hope to be adopted, thank you!

Additional context

Expect:

import { useFileDialog } from '@vueuse/core'

const { files, open, reset, onChange } = useFileDialog()

onChange((files) => {
  /** do something with files */
})

Actual:

import { watch } from 'vue'
import { useFileDialog } from '@vueuse/core'

const { files, open, reset } = useFileDialog()

watch(files,(files) => {
  /** do something with files */
})

---

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.

[melishev]

@Alfred-Skyblue The onChange method does not work if I try to load the same file twice.

The method will work the first time, but the second time it will be silent

[Alfred-Skyblue]

@melishev When the same file is selected, the onchange of the input will not be triggered. This is a feature of the input. You can pass reset as true to clear the value of the input every time it is opened.