【Vue】通过文本输入的字数限制button的disabled可用状态

界面如图：通过在文本框里输入，获取输入的长度来判断button是否可用

		<div id="app">
			<textarea v-model="message" v-focus @keyup="TextLeng"></textarea></br>
			<label style="color:dimgrey">当前字数：<span>{{mesleng}}</span></label></br>
			<button type="button"  @click="Clk" v-bind:disabled="dis">提交</button>
		</div>

@keyup事件每输入一个字符触发一次，而change是当文本框的onbulr触发后触发，效果不是很好，所以这边用keyup，具体代码如下

		<script>
			/* 获得焦点 */
			Vue.directive('focus', {
				inserted: function(el) {
					el.focus();
				}
			});
			var vue = new Vue({
				el: "#app",
				data: {
					message: "",
					mesleng: "",	/*获取长度*/
					dis: false		/*控制button可用状态，true为不可用*/
				},
				methods: {
					TextLeng: function() {
						var leng = this.message.length;
						this.mesleng = leng;
						if (leng > 50) {
							this.dis = true;
						} else {
							this.dis = false;
						}
					},
					Clk: function() {
						if (this.message.length <= 50) {
							alert("success");
						} else {
							alert("长度大于五十提交失败");
						}
					}
				}
			});
		</script>