Question

我遇到了关于类反应性的错误，尽管进行了大量测试，但仍找不到解决方案。

我使用本地方法修改数据并且它可以工作，但是，这个DOM（反应性）的应用程序不会超过一个。经过一次修改后，DOM就会被填充。

我使用Vue扩展，我使用$ set来定义属性值（因为vue的扩展使用了返回对象）或直接访问，但结果始终相同。

你有什么想法吗？

提前致谢。

的Jérémy

Answer 1

It's an exemple of code (i use webpack to build my vue app, javascript script separate to html).

<div id="modalMemberEdit" class="modal fade modalmember" v-bind:class="{ 'in':showmodal }" role="dialog" v-bind:style="{'display':displaymodal,'border':bordermodal}">
    <div class="modal-dialog">
        <!-- Modal content-->
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" v-on:click="hideModal">&times;</button>
            </div>
            <div class="modal-body">
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-rouge" v-on:click="hideModal" ></button>
            </div>
        </div>
    </div>
</div>


const modalMemberEdit = Vue.extend({
    name: "modalMember",
    data: function () {
        return {
            displaymodal: "none",
            bordermodal: "15px solid white",
            showmodal: false,
        }
    },
    methods: {
        showEditModal: function( id ) {
            this.$set(this._data,"showmodal",true);
            this.$set(this._data,"displaymodal","block");
        },
        hideModal: function() {

            this.$set(this._data,"showmodal",false);
            this.$set(this._data,"displaymodal","none");
        }
    },
    mounted: function() {
       this.$set(this._data,"showmodal",true);
       this.$set(this._data,"displaymodal","block");
    }
});

VueJS在类和样式上的错误交互性

1 个答案: