Javascript VueJS组件
我想使用VueJS组件来清理脚本。因此，我在Laravel中加载的每个页面都有一个组件。到目前为止一切正常。但我在将当前脚本逻辑传输到组件时遇到问题 这是导入要使用的组件的当前脚本设置： main.jsJavascript VueJS组件,javascript,laravel,vue.js,vuejs2,Javascript,Laravel,Vue.js,Vuejs2,我想使用VueJS组件来清理脚本。因此，我在Laravel中加载的每个页面都有一个组件。到目前为止一切正常。但我在将当前脚本逻辑传输到组件时遇到问题 这是导入要使用的组件的当前脚本设置： main.js import HomeView from './components/HomeView.vue'; import IncidentView from './components/IncidentView.vue'; window.app = new Vue({ el: '.content
import HomeView from './components/HomeView.vue';
import IncidentView from './components/IncidentView.vue';
window.app = new Vue({
el: '.content',
components: {
HomeView, IncidentView
},
methods: {
// Init GIS
init: function() {
// Initialize GIS Map
initGISMap(this.$els.map);
},
}
(...)
}
window.app=new Vue…<!DOCTYPE html>
<html>
<body class="hold-transition skin-blue sidebar-mini">
<section class="content-header">
<h1>
@yield('page_title')
<small>@yield('page_description')</small>
</h1>
</section>
<!-- Main content -->
<section class="content">
@if (isset($vueView))
<component is="{{ $vueView }}">
@endif
@yield('content')
</component>
</section>
<!-- /.content -->
<script src="https://maps.googleapis.com/maps/api/js?key=KEY&libraries=places&callback=app.init" async defer></script>
</body>
</html>
vueViewHomeViewapp.init@extends('app', ['vueView' => 'home-view'])
@section('page_title', 'title')
@section('page_description', 'title')
@section('content')
content
@endsection
<script>
export default {
data: {
// SEARCH
addressComponents: '',
autocompletePlace: '',
autocompleteAddress: '',
(...)
}
导出默认值{
数据：{
//搜寻
地址组件：“”，
自动完成位置：“”，
自动完成地址：“”，
(...)
}
我如何修改我的组件，使app.init加载仍能正常工作？如果我没弄错的话，你有一个谷歌地图脚本，加载后会调用window.app.init，对吗 您的Vue组件是否有init（）方法（上面没有显示）？如果有，则需要在app.methods.init（）中。请记住，对于VueJS，标准可调用方法位于methods键下 或者：您不提及您的app.init是否是Vue组件的一部分。如果不是，则表明您的app.init函数正在被重写，因为您正在将window.app重新定义为Vue组件
最后，如果您的init是Vue的一部分，那么您的google maps fn回调是否在加载Vue之前调用此init（），因此不存在此类方法？也许您应该使用或至少研究这样做的包的代码 例如，您可以在Github上检查vue google maps：
它定义了大量与谷歌地图相关的组件。有人已经提到，npm上提供的组件为
vue谷歌地图vue2 google maps我希望这有帮助是的。我正在导入Google地图脚本，并告诉它通过脚本中的window.app.init调用在页面加载上加载init方法。我已经添加了init（）方法，它不是偶然显示的，而是存在的，可以完美地加载与映射相关的所有内容。所有方法都在方法键内活动和工作。现在的目标是重构代码并作为“主”加载的页面包含地图视图，我想创建一个组件，该组件只包含此页面所需的所有内容。另一个页面将有不同的内容，我想在那里使用不同的方法。app.init不是组件的一部分。这些组件看起来就像现在描述的。实际上表达式
window.app=new Vue