Stencil: Allow single @Watch decorator declaration to watch multiple props

[anthonylebrun]

I'm submitting a:

[ ] bug report
[x ] feature request
[ ] support request

Current behavior:

@Watch('authToken')
handleAuthTokenChange(value : string) : void {
  console.log(`authToken changed to ${value}`)
  this.doCommonThing()
}

@Watch('environment')
handleEnvironmentChange(value : string) : void {
  console.log(`environment changed to ${value}`)
  this.doCommonThing()
}

Expected behavior:

@Watch(['authToken', 'environment'])
handleAPIChange(prop : string, value : string) : void {
  console.log(`${prop} changed to ${value}`)
  this.doCommonThing()
}

This would just be a nice shorthand in situations where you have some common side-effect-y or stateful changes you need to make based on a bundle of related props. I've looked at the source code and I think I could probably work a PR for this if I get feedback that this feature makes sense and would be welcome.

[manucorporat]

@anthonylebrun you can do:

@Watch('authToken')
@Watch('environment')
handleAPIChange(prop : string, value : string) : void {
  console.log(`${prop} changed to ${value}`)
  this.doCommonThing()
}

I will be very unlikely for us to add yet another API for the same thing, our goal is to actually reduce the API surface to the minimum! :)

[flawyte]

I just stumbled upon this issue, and I didn't know that you could use multiple @Watch() annotations on the same method either.
Maybe this could be added to the docs? @manucorporat

[anthonylebrun]

Oh nice. Didn't know about the decorator chaining. Would definitely be nice to have that in the docs! Thanks!