add @WatchSub decorator

[vanhoavn]

Add @WatchSub decorator to handle key-path watches @WatchSub('variable.key1.key2').
(Add this ass new decorator so normal check for single property watch @Watch can still be useful).

[HerringtonDarkholme]

Hi @vanhoavn , thanks for your contribution.

Actually I have considered key-path watch when designing this library. I deliberately leave it in component meta data since I cannot type check keypath.

If you need watch key path, you can do it in Component

@Component({
  watch: {
    'variable.key1.key2': handler,
  }
})
class Comp extends Vue {}

Also, key-path type checking is possible in new TypeScript. microsoft/TypeScript#12290 (comment). I wonder whether it is good enough for average users so I didn't include it. Maybe it is a better alternative than WatchSub.

Thanks for your contribution again

[vanhoavn]

Thanks, that's why i made it as a new decorator, putting functions in the meta require casting this to Comp before all use, while with decorator we can better organize the code into folding blocks.

[vanhoavn]

The new TypeScript's key-path type checking you mentioned above use array to hold each element in path's type so they can statically checked, while in Vue we use dotted notation, which require split before any subsequence checking.

[HerringtonDarkholme]

I will implement key path watch in new version. Please wait.

[HerringtonDarkholme]

Supported in 0.6.1

Warn beforehand: nested watch is not a good practice, in fact, watch is a helper shortcut which can be substituted by computed properties.

Adding watch path in component meta is a warning embodied by API design, actually.