Question

如何在v-if上更改加载了vue js的元素的文本这是一个例子：

<div id="app">
    <div v-if="show == 'first'">
        <p>something</p>
    </div>
    <div v-else-if="show == 'second'">
        <p>something2</p>
    </div>
</div>

<script src="https://unpkg.com/vue"></script>

<script>
    let app = new Vue({
        el: '#app',
        data: {
            show: 'first'
        }
    })
</script>

这是更改文本的jquery：

<script type="text/javascript">
    $(document).ready(function() {
        let hovers = JSON.parse('{!! $module->hoverBalloons->toJson() !!}')

        console.log(hovers) 

        let element = '';

        for(let hover of hovers) {
            element = $('input[name="'+hover.form_field+'"], select[name="'+hover.form_field+'"], textarea[name="'+hover.form_field+'"]')
            // Search for an input with the same name or id as the form_field
            if (element.length > 0) {
                let id = element.attr('id')
                $('label[for="'+id+'"]').text(hover.label)                   
            }
            else {
                element = $('input#'+hover.form_field + ', select#'+hover.form_field + ', textarea#'+hover.form_field)

                // If the element is radio button change the span next to it
                if (element.attr('type') == 'radio') {
                    element.next('span').text(hover.label)
                }
                else {
                    $('label[for="'+hover.form_field+'"]').text(hover.label)
                }
            }
        }

        $('[data-toggle="tooltip"]').tooltip(); 
    })
</script>

jQuery不会改变示例vue中的任何内容，因为我只是举例说明，所以代码更简单。实际的代码有点复杂，但我写的只是为了让你能够理解。所以问题是jQuery不会改变用v-if指令加载的元素。我如何让它改变它们？注意：我想到了v-show，但遗憾的是，由于vue过渡等原因，我不能选择。

在vue js v-if上加载的jQuery更改元素

0 个答案: