当我尝试将props传递给.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>
答案 0 :(得分:5)
使用binding syntax,而非文字插值。
<template>
<div>
<input type="text" v-bind:placeholder="placeholder">
</div>
</template>
还有一个简写。
<template>
<div>
<input type="text" :placeholder="placeholder">
</div>
</template>