通过VueJS设置输入值并混合值的内容

时间:2017-06-30 10:34:23

标签: vue.js vuejs2

我试试这个:

A* a = new Derived();
if(typeid(&A::reset)==typeid(&Derived::reset))// no override
{ *a = Derived(); } // instead of calling a1->reset()
else { a->reset(); } // if there is override

可能以某种方式在输入字段中显示“用户名是:John Doe”?

或者我确实需要在这种情况下使用计算值?

2 个答案:

答案 0 :(得分:2)

选项似乎是直接绑定到值而不是v模型,或创建计算属性和v模型:

https://codepen.io/aprouja1/pen/jwxagE

new Vue({
  el:'#app',
  data(){
    return{
      user:{
        name:'Bob'
      }
    }
  },
  computed:{
    nameString(){
      return `The user name is: ${this.user.name}`
    }
  }
})

答案 1 :(得分:0)

你要求的(我认为)它有点令人困惑,因为你基本上说你希望文本框包含像#34这样的文字;用户名是:Bob"但是你希望user.name等于#34; Bob"即使用户将文本框值编辑为某些文本,甚至可能不以&#34开头;用户名是:"。

实际上是文本&#34;用户名是:&#34;不应该在文本框中,它应该是<label>

  <label>The user name is:</label>
  <input type="text" name="username" v-model="user.name">

您还可以使用CSS创建自己的自定义&#34;输入&#34;包含<label><input>元素的元素,其中所有样式都已删除,因此它看起来像文本&#34;用户名是:&#34;是可编辑文本的一部分,但实际上并非如此。