vue Class 切换。

Question

实现focus的时候添加个class，blur的时候去掉，下面的方法以及实现成功，但是我总觉写得太菜了，请问有什么更为简洁的实现方法吗？感谢

2017年2月20日09:53:52补充
问题已经解决了，是我把问题复杂化了，伪类可以很简单的解决掉问题，一个:focus加上:focus + 轻松搞定

<div class="item">
            <input
                   v-model="user.val"
                   @blur="[checkUser,blur('user')]"
                   @focus='Focus("user")'
                   id="user" name="user"
                   type="text">
           <label for="user">用户名</label>
          </div>
          <div class="item">
            <input id="password"
                   v-model="user.password"
                   @blur="blur('password')"
                   @focus='Focus("password")'
                   name="password"
                   type="text">
            <label for="password">密码</label>
          </div>

data () {
      return {
        user: {
          val: null
        },
        password: {
          val: null
        }
      }
    },

      blur: function ($select) {
        this[$select].focus = this[$select].val
      }

Answer 1

你应该用css伪类选择器 ..

Answer 2

直接伪类就好了。用vue绑定focus的伪类。

Answer 3

vue-loader提供的css module

Answer 4

这个用vue来实现未免小题大做了吧，使用伪类是更好的方案

.item input:focus {
    // css code
}