Параметризация v-модели в компоненте Vue - PullRequest
Новая
       7

Параметризация v-модели в компоненте Vue

0 голосов
/ 08 ноября 2018

Я написал небольшой компонент для абстракции повторяющегося HTML: 

<template>
  <div class="form-group">
    <label for="desc">{{label}}</label>
    <input id="desc" readonly type="text" class="form-control input-sm"
           v-model={{v_model}}/>
  </div>
</template>

<script>
export default {
  name: 'HelloWorld',
  props: {
    label: String,
    v_model: String
  }
}
</script>

<style scoped>
</style>

Это дает ошибку: 

Error compiling template: 

<div class="form-group"> 
  <label for="desc">{{label}}</label>
  <input id="desc" readonly type="text" class="form-control input-sm"
         v-model={{v_model}}/> </div>
- invalid expression: Unexpected token { in 

  {{v_model}}/

Raw expression: v-model="{{v_model}}/"

Я ожидаю, что вещи, присвоенные атрибутам v-..., должны быть выполнены каким-то другим способом, но я пока не знаю, как.

1 Ответ

0 голосов
/ 08 ноября 2018

Решение было: 

<template>
  <div class="form-group">
    <label for="desc">{{label}}</label>
    <input id="desc" type="text" class="form-control input-sm"
           v-bind:value="value"
           v-on:input="$emit('input', $event.target.value)"
    />
  </div>
</template>

<script>
export default {
  name: 'FormGroup',
  props: {
    label: String,
    value: String
  },
  data: function() {
    return {
    }
  }
}
</script>

<style scoped>
</style>
...