Vuejs組件道具作爲字符串

Question

我想通過這個道具作爲一個字符串：

<list-view :avatar="pictures"></list-view> 

但我認爲Vue公司認爲我想調用一個方法，因爲我得到這些警告：

[Vue警告]：屬性或方法「圖片」未在實例上定義，但在渲染過程中被引用。確保在數據選項中聲明反應數據屬性。

[Vue警告]：無效的道具：類型檢查失敗的道具「頭像」。期望的字符串，得到未定義。

如何將"pictures"作爲字符串傳遞？

Here is my jsfiddle

Answer 1

眼下，Vue公司正試圖找到一個名爲pictures傳遞的屬性值到子組件變量。

如果要指定在內嵌式的字符串值，您可以用引號括值，使之成爲字符串：

<list-view :avatar="'pictures'"></list-view> 

---

或者，如下面@Zunnii回答，如果傳遞價值實際上只是一個靜態的字符串，可以簡單地忽略v-bind結腸速記：

<list-view avatar="pictures"></list-view> 

這樣，avatar道具子組件的將被分配字符串值"pictures"。

Answer 2

如果你真的想通過靜態的字符串，你可以直接傳遞字符串沒有V-綁定

<div id="app"> 
    <greeting text="world"></greeting> 
</div> 

然後在JS文件

Vue.component('greeting', { 
    props: ['text'], 
    template: '<h1>Hello {{ text }}!</h1>' 
}); 


var vm = new Vue({ 
    el: '#app' 
}); 

的jsfiddle =>https://jsfiddle.net/dpLp4jk8/