小编dap*_*apo的帖子

如何通过router-viewVue.js 将数据从主应用程序传递到组件？我已成功从API获取数据，如下所示：

mounted() {
    // console.log(model)
    this.model = model;
    // console.log(this.model)
}

我想要将数据传递到的组件已加载，如下所示：

@section('content')
<div style="padding: 0.9rem" id="app">
    <router-view name="bookBus"></router-view>
    <router-view></router-view>
    {{-- @{{ model }} --}}
</div>

@stop

如何将model数据传递到bookBus组件？

我有一个简单的形式像这样

<form @submit.prevent="getSummary">
    <input type="text" v-model="userAcccount" placeholder="Enter Account 
    Number">
    <button type="submit" class="btn btn-xs btn-default">Submit</button>
</form>

Vue中我的方法对象中的getSummary方法是这样的

methods: {
        getSummary () {               
            axios.get('core/handle.php', {
                params: {
                  accountNumber: this.userAcccount
                }
              })
              .then(function (response) {
                this.userData = response.data;
                console.log(this.userData);
              })
              .catch(function (error) {
                alert(error);
            });
        }
    }

我的数据对象包含

data: {
        userAcccount: '',
        userData: []
    },

我试图用axios的响应更新userData，然后使用它填充表以进行测试，我只是尝试了

<span v-if="userData.length > 0">
      some data 
</span>
<span v-else>
      data not found
</span>

console.log向我显示userData已更新，但是上面的这段代码没有更改。