How to modify data in Vue when, JQ (native JavaScript coexists with Vue and JQuery

< H1 > scene < / H1 >

there is already a DataTables-based table on the page. has too many functions to be implemented by Vue .

now you need to implement selecting some entries in DataTables and then performing subsequent operations in Vue.

< H1 > current problems < / H1 >

after being packaged through Webpack, you cannot get an example of app in console, and you don"t know how to modify the data in vue.

< H1 > Code < / H1 >

app.js

import ElementUI from "element-ui";
import "element-ui/lib/theme-chalk/index.css";
import App from "./App.vue";

Vue.use(ElementUI);

Vue.component("example-component", require("./components/ExampleComponent.vue"));

const app = new Vue({
    el: "-sharpvueapp",
    render: h => h(App)
});
< H1 > Project dependent version < / H1 >

"vue": "^ 2.5.16"

webpack:3.12.0

use Laravel 5.6to build

< H1 > desired solution < / H1 >

1. A piece of code that uses native JS or JQuery to modify data in Vue
how to expose the vue example in console after 2.webpack packaging.

problem description

the environmental background of the problems and what methods you have tried

related codes

/ / Please paste the code text below (do not replace the code with pictures)

what result do you expect? What is the error message actually seen?

Mar.31,2021

vue is an object-based component library (all components are objects, and his methods and data exist in component objects.
and you have to use a library that operates dom to manipulate Vue objects and modify vue data. How is that possible? even if you change the dom node, it won't work. Vue will change it back next time.
and the native js is indeed an operable object, you expose the object, then manipulate it through js, and then change the data, but if you manipulate the vue object, why not just use vue?


window.app = new Vue({
    el: '-sharpvueapp',
    render: h => h(App)
});
Menu