2019/05/22

Vue.jsで文字数カウントを表示











See the Pen Vue.jsで文字数カウントを表示 by takapen (@takapen) on CodePen.







残り{{ remaining }}文字








new Vue({
  el:'#app1',
  data:{
    myText:''
  },
  computed:{
    remaining:function(){
      return 140 - this.myText.length;
    },
    computedColor: function(){
      col = '#33a';
      if(this.remaining < 20){
        col = '#3a3';
      }
      if(this.remaining < 1){
        col = '#a33';
      }
      return col;
    }
  }
});