Question

是否可以对Vue.js呈现的原始HTML使用.on() jquery绑定？例如，返回的注释主体将包含jquery脚本绑定到的链接（<a data-post="url">）：

<div id="comments">
    <div v-for="comment in comments">
        @{{{ comment.body }}}
    </div>
</div>

Vue脚本：

new Vue({
    el: '#comments',
    data: {
        comments: []
    },
    ready : function () {
        this.fetch();
    },
    methods : {
        fetch: function () {
            this.$http.get('api/comments', function (comments) {
                this.$set('comments', comments);
            });
        }
    }
});

Jquery脚本：

$('[data-post]').on('click', function(e)
{
    e.preventDefault();
});

这可能吗？注释显示正确，但似乎jquery绑定没有生效？

非常感谢任何帮助，谢谢！

Answer 1

绑定在body而不是data-post属性允许我完成此操作：

$('body').on('click', '[data-post]', function(e) {
    e.preventDefault();
});

// Instead of

$('[data-post]').on('click', function(e) {
    e.preventDefault();
});

从ajax请求返回原始JSON HTML并在Vue中呈现它似乎工作正常。

Jquery .on（）Vue.js呈现原始HTML

1 个答案: