Надеюсь, я правильно спрашиваю. У меня есть скомпилированное приложение Vue, и я хотел бы добавить компоненты вне кода компиляции, который был бы моим основным кодом. Я не хочу, чтобы никто не трогал основной код, но они могут создавать компоненты и получать доступ к данным хранилища внутри компонента vue. Как этого достичь?
- Добавление компонента в приложение compile vue
- Доступ к хранилищу vuex внутри компонента
HTML index.html
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8>
<meta name=viewport content="width=device-width,initial-scale=1">
<title>chatbot</title>
<script src=https://cdn.jsdelivr.net/npm/es6-promise@4/dist/es6-promise.auto.js></script>
<link href=/static/css/build.css rel=stylesheet>
</head>
<body>
<div id=app></div>
<script type=text/javascript src=/static/js/manifest.js></script>
<script type=text/javascript src=/static/js/vendor.js></script>
<script type=text/javascript src=/static/js/build.js></script>
</body>
</html>
HelloWorld.vue
<template>
<div class="hello">
<h1>{{ msg }}</h1>
<h2>Essential Links</h2>
</div>
</template>
<script>
export default {
name: 'HelloWorld',
data () {
return {
msg: 'Welcome to Your Vue.js App'
}
}
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
h1, h2 {
font-weight: normal;
}
ul {
list-style-type: none;
padding: 0;
}
li {
display: inline-block;
margin: 0 10px;
}
a {
color: #42b983;
}
</style>