Динамическая v-модель не завершает ввод с использованием директивы v-html - PullRequest
Новая
       12

Динамическая v-модель не завершает ввод с использованием директивы v-html

0 голосов
/ 13 января 2019

У меня есть компонент, где я применил 

<div v-html="dataProperties.replace(/name/g, index)">

Внутри dataProperties, который является необработанным HTML, у меня есть тег ввода с
v-model="data[name].property" за исключением того, что входные данные остаются пустыми, даже если data [index] .property существуют и не равны NULL в данных моего компонента. 

<template>
<div class="entity-list" :class="{'client-empty': !entities.length, row: entities.length}">
    <div v-for="(entity, index) in entities" class="col-md-6 entity-item">
        <div class="data">
            <slot :entity="entity">
                {{ entity.id }}
            </slot>
            <div v-html="dataProperties.replace(/__name__/g, index)">
            </div>
        </div>
    </div>
    <template v-if="!entities.length">
        <h6>Aucun gestionnaire</h6>
        <img :src="imgPath" alt="tobad"/>
    </template>
</div>
</template>

<script>
    export default {
        name: "ListingForm",
        props: [
            'entities',
            'imgPath',
            'dataProperties'
        ],
        data() {
            return {
            }
        }
    }
</script>

1 Ответ

0 голосов
/ 13 января 2019

Ваш ввод не будет привязан к этому элементу данных, поскольку он не скомпилирован, согласно official docs

Содержимое span будет заменено значением свойства rawHtml, которое интерпретируется как обычный HTML - привязки данных игнорируются. Обратите внимание, что вы не можете использовать v-html для составления частичных шаблонов, потому что Vue не является движком шаблонов на основе строк. Вместо этого компоненты являются предпочтительными в качестве фундаментальной единицы для повторного использования пользовательского интерфейса и композиции

Чтобы справиться с вашим сценарием использования, вы должны действовать иначе, как только передавать данные, а не необработанный html через реквизиты, и связывать свой ввод нормально

...