Princípio do modelo v:
A partir do contato com a Vue, sabemos que o modelo v é obter uma ligação de dados bidirecional.Qual é o princípio da ligação?
De fato, o modelo v é essencialmente açúcar sintático.Depois de usar o modelo v, os dados são vinculados e um ouvinte de evento @input é adicionado.
<input v-model = 'search' />
É equivalente a
<input: bind = 'search' @ input = 'search = $ event.target.value'>
Ao usar o modelo v no elemento de entrada para obter dupla ligação de dados, na verdade, o evento de entrada do elemento é acionado durante a entrada.Por esse açúcar sintático, a ligação bidirecional dos dados dos componentes pai e filho também pode ser alcançada.
Componente pai:
Subcomponentes:
Os dados do componente pai são vinculados à propriedade props do componente filho por meio de v-bind, e o valor é usado por padrão em props e, em seguida, a entrada do evento é acionada por $ emit, porque o evento vinculado pelo modelo v é introduzido. O evento de entrada do componente pai é acionado no componente filho. Ao acionar o evento para passar o valor, é alcançada a ligação bidirecional dos dados do componente pai e filho, o que é reduzido em comparação ao uso direto do v-bind e do código de evento personalizado.