の内容を混合、私はこれを試してみてください。VueJSで設定した入力値を、その値
<input type="text"
name="username"
v-model="user.name"
:value="'The user name is: '+user.name">
が提出された入力に表示する何とかことは可能ですが、「：ジョン・ドウユーザー名がある」とは？
この場合、計算値を使用する必要がありますか？
基本的に「ユーザー名は：Bob」のようなテキストをテキストボックスに入れたいが、user.nameは「Bob」と同じにしたいと言っているので、ちょっと混乱していると思う。ユーザーがテキストボックスの値を "The user name is："で始まらないテキストに編集した後でさえ、
現実的にテキストは、「ユーザー名は次のとおりです。」まったくテキストボックスにすべきではない、それは<label>する必要があります：
<label>The user name is:</label>
<input type="text" name="username" v-model="user.name">
あなたはまた、独自のカスタム「入力」要素を作成するためにCSSを使用することができますすべてのスタイルが削除された<label>と<input>という要素が含まれているため、「The user name is：」というテキストのように見えますが、編集可能なテキストの一部ですが実際はそうではありません。
実際に私はそれを言っているわけではありません:)私はデータモデル 'data.user.name'を持っており、それは他の場所から更新されています。フィールドにユーザー名{{user.name}}を表示したいだけです。すべてのthextは、入力フィールドの値にする必要があります。 – netdjw
その場合、 'v-model'を削除して'：value'バインディングを使うだけです。 –
オプションではなく、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}`
}
}
})
することができますプレースホルダー –
を使用して、このコードを表示できますか？ – netdjw
v-modelを使用しているため、入力フィールドが空になるまで、プレースホルダテキストは表示されません。あなたはユーザー名の入力フィールドにユーザー名を表示したくないので、あなたが望んでいる正確なユースケースは何ですか？ –