使用JQuery访问PHP内部的Vue JS组件数据

我有一个vue js应用程序，它是在php项目中自己的环境中编译和呈现的。我使用的是旧版本的PHP框架，而不是Laravel

我的vue js应用程序实例是在main.js文件中创建的

Vue.component(
    'Dashboard',
    require('./components/dashboard/Index.vue').default
);
console.log(window.location);
const router = new VueRouter({
    mode: "history",
    base: window.location.pathname,
});

var myVueInstance = new Vue({
    router
}).$mount('#app');

然后我在我的项目中的结束标记之前使用这个已编译的vue js应用程序

<script src="<?php echo getenv('APP_DEBUG') == 'false'
    ? Yii::app()->baseUrl.'/js/vue/js/main.min.js'
    : 'http://localhost:8080/js/main.js' ?>"></script>

但我不能这样做，因为它总是没有定义

---

有什么方法可以做到这一点吗？

我尝试了以下方法，但仍然发现my vue实例变量未定义。奇怪的是，这是因为它超出了我的要求

在安装vue组件时，我最终在vue组件本身中侦听单击。我在单击时获得值，然后在组件内部设置vehicleid

  mounted() {
    var self = this;
    this.$nextTick(() => {
      $(document).on("click", ".quoteUploadModal", function(){
        self.vehicleid = $(this).closest('.openQuoteModal').data('id');
      });
    });
  },

---

您的最后一个脚本是在Vue main.js？@cHida before之前或之后执行的。main.js编译的代码是在关闭body标记之前的页面末尾，所以脚本是在Vue实例化之前执行的。试着放在主音后面。js@cHida我已经这样做了，但它说“myVueInstance”是未定义的。

var self = this;
$(document).on("click", ".openQuoteModal", function () {
    myVueInstance.$refs.quoteUpload.vehicleid = $(this).data('id'); //this doesnt work.
}); 

  mounted() {
    var self = this;
    this.$nextTick(() => {
      $(document).on("click", ".quoteUploadModal", function(){
        self.vehicleid = $(this).closest('.openQuoteModal').data('id');
      });
    });
  },