我得到了两个控制不同html块的Vue js类(每个类都有script标签,因为我有服务器端的模板渲染)
<li class="nav-item navbar-center" id="site-header">
<a class="nav-link text-white h6" href="#" v-on:click="displayModal()">
Log In / Sign Up
</a>
</li>
new Vue({
el: '#site-header',
delimiters: ['[[', ']]'],
data: {
showModal: 'none',
},
methods: {
displayModal() {
if (this.showModal === 'none') {
this.showModal = 'block';
} else {
this.showModal = 'none';
}
},
},
})第二个
<div class="row" style="margin-top: 30px" id="car_pre_reserve">
<textarea v-model="messageSender" id="direct-message" placeholder="Your message here..."></textarea>
<button v-on:click="sendMessage()" class="button" type="button">SEND MESSAGE</button>
</div>
new Vue({
el: '#car_pre_reserve',
delimiters: ['[[', ']]'],
data() {
return {
messageSender: '',
}
},
methods: {
sendMessage() {
this.messageStatusDisplay = 'block';
setTimeout(() => {
this.messageStatusDisplay = 'none';
}, 10000);
},
},
});问题是,我可以从不同的vue类调用displayModal()吗?如何做到这一点?
发布于 2020-01-16 17:18:47
哈,这很简单
我将class赋值给变量
var header = new Vue({...})然后在第二个类中调用header.displayModal()
https://stackoverflow.com/questions/59765745
复制相似问题