Vue 구성 요소의 요소 특성에 소품 전달

Question

.vue 파일의 HTML 요소 특성에 소품을 전달하면 렌더링이 중지됩니다. 내가 도대체 ​​뭘 잘못하고있는 겁니까?

script.js

import hInput from './components/hInput.vue' 
Vue.component('h-input', hInput); 
const app = new Vue({ 
    el: '#head', 
}); 

index.php를

<div id="head"> 
    <h1>{{config('app.name')}}</h1> 
    <h-input placeholder="Hi" name="hello"></h-input> 
</div> 

hInput.vue

<template> 
    <div> 
     <input type="text" placeholder="{{placeholder}}"> 
    </div> 
</template> 

<script> 
    export default { 
     props: ['placeholder', 'name'] 
    }; 
</script> 

Answer 1

사용 : 여기 코드는 binding syntax, 텍스트 보간이 아닙니다.

<template> 
    <div> 
     <input type="text" v-bind:placeholder="placeholder"> 
    </div> 
</template> 

약식이 있습니다.

<template> 
    <div> 
     <input type="text" :placeholder="placeholder"> 
    </div> 
</template>