vue+jquery开发问卷模块产生的一些虚拟DOM的问题

最近用vue做了一个问卷模块，简单说一下整个模块，由于是问卷，我们需要将问卷题目和答案来回传送，所以要用到jquery来操作DOM（不得已而为之），但是这时候就产生一个问题，因为vue中，答题方在通过接口获取到问卷题目的同时，在填报了答案后，由于是虚拟DOM，我们无法获取渲染题目的input对应的value值，这个时候我们就必须用到一个办法，简单来说就是在渲染前我们把接口返回的问卷题目当做一个组件进行vue.extend渲染，然后再把该组件引入到我们答题页面对应的位置，这样我们就可以获取到真实DOM，当然对应的input的值我们也就可以获取到了，下面贴一下原理代码：

<template>
    <div class="children">
        <h1>
            我是父组件
        </h1>
        <div class="parent" id="parent">
        </div>
    </div>
</template>

<script>
    import Vue from 'vue';
    var MyComponent = Vue.extend({
        template: '<a @click="show(1)">我是大魔王</a>',
          methods: {     
            show(i) {
                console.log(i);
            },
        }
    });
    var component = new MyComponent().$mount();
    export default {
        data() {
            return {
            }
        },
        methods: {
        },
        mounted() {
            document.getElementById('parent').appendChild(component.$el);
        }
    }
</script>

<style scoped>
</style>
大家请看，上面的a标签作为一个新的组件用vue渲染后，jquery的append方法追加到parent中，对应a上的点击事件才能触发，而且a标签的性质已经是vue文档中的一员，所以@click是可以响应的，vue和jquery其实是背道而驰的，但是如果真的要同时使用两者的话，我们也要能做到没有障碍，技术之间的联系是有的，没有任何两种模式是完全不兼容的。vue的缺点是只能通过data的变化来更新DOM，但是jquery好处是直接就能操作你想更新的DOM，各有千秋，你还别说，有些地方，jquery真的方便，比如，写一个独具特色的下拉菜单，如果UI框架没有提供的话，你用vue写一个交互是很难的，基本做不到。