Question

我有一个脚本，需要在模态窗口上输出答案的结果。但是目前还没有渲染。结果在模态HTML外部正确输出；甚至检查可见的模态源都表明数据没有渲染；也就是说，结果不会从视图中隐藏，根本不会计算出来。

完整资料在 http://www.sic-parvis-magna.com/sicpm/mayan-vue/index.html

有问题的变量为userAnswer，userAnswerDisplay和userMessage

<div class="modal">
    <div class="modal-background"></div>
    <div class="modal-card">
        <section class="modal-card-body">
            <div v-if="userAnswer !== -1">
                <div id="user-answer" v-html="userAnswerDisplay"></div>
                <div id="user-answer-message" v-html="userMessage"></div>
                <div id="user-hint"></div>
            </div>
        </section>
        <footer class="modal-card-foot">
            <button class="button is-success">Save changes</button>
            <button class="button modal-close">Cancel</button>
        </footer>
        <button class="modal-close is-large" aria-label="close"></button>
    </div>
</div>

Answer 1

问题在于您的模式模板不在Vue应用程序（即section#mainapp）之外，因此Vue无法处理该模板：

<section id="mainapp">...</section>

<div class="modal">...</div> <!-- FIXME: Move this into section above -->

将模态移动到section#mainapp中，以评估计算出的属性。

demo

Vuejs变量不在模态上显示

1 个答案: