要使用Vue實例傳遞值，我們需要使用props。Props是Vue中傳遞值的一種方式。這種方式允許父組件向子組件傳遞數(shù)據(jù)。

Vue.component('child-component', {
props: ['message'],
template: '
{{ message }}
'
})
new Vue({
el: '#app',
data: {
message: 'Hello Vue!'
}
})

在上面的代碼中，我們通過props屬性定義了一個message屬性。然后我們在子組件的模板中使用了這個屬性。現(xiàn)在我們可以在父組件中向子組件傳遞數(shù)據(jù)。

<div id="app">
<child-component v-bind:message="message"></child-component>
</div>

在父組件中，我們使用v-bind綁定了message屬性。這樣，在子組件中就可以使用這個屬性了。

當然，你也可以直接在子組件中使用props：

Vue.component('child-component', {
props: ['message'],
template: '<div>{{ message }}</div>'
})

現(xiàn)在讓我們來看一個更復雜的實例。假設(shè)我們有一個父組件，它有一個數(shù)組屬性。然后我們又有一個子組件，它需要顯示這個數(shù)組的內(nèi)容。我們可以通過props屬性來實現(xiàn)這個功能：

<div id="app">
<parent-component></parent-component>
</div>
Vue.component('child-component', {
props: ['item'],
template: '<li>{{ item }}</li>'
})
Vue.component('parent-component', {
data: function () {
return {
items: ['Item 1', 'Item 2', 'Item 3']
}
},
template: '<div><ul><child-component v-for="item in items" v-bind:item="item"></child-component></ul></div>'
})
new Vue({
el: '#app'
})

在上面的代碼中，我們有一個父組件和一個子組件。父組件有一個items屬性，它是一個字符串數(shù)組。在子組件中，我們定義了一個item屬性，它用來顯示父組件中的單個項目。

在父組件的模板中，我們使用v-for指令來遍歷items數(shù)組，然后使用v-bind綁定item屬性。這樣，我們就可以在子組件中顯示每一個項目了。

總之，Vue實例傳遞值是非常簡單易用的。使用props屬性，我們可以很容易地在父組件和子組件之間傳遞數(shù)據(jù)。