在Vue中动态绑定label标签中的for (Interpolation inside attributes has been removed)

• 在Vue中想要动态绑定label中的for的值,一开始这样写的:

<div id="app">
     <label for="{{ name }}"><span>{{ message}}</span></label>
     <input type="text" id="{{ name }}" key="{{ name }}">
     <button @click="loginType">切换类型</button>
 </div>

• 这样写的话,虽然也可以实现点击文字选中input的效果,但是会在控制台报一个警告 :
  
• 按照其中的警告,可以修改为 :

 <div id="app">
     <label :for="name"><span>{{ message}}</span></label>
     <input type="text" :id="name" :key="name">
     <button @click="loginType">切换类型</button>
 </div>

• 这样则会去掉警告