Vue中封裝input組件
最近有點忙不過來 脫了很久，沒有更新 抱歉。今天要將的時如何自定義封裝input組件 ，博主知識發個簡單的模板 碼友們可以更具自己的實際項目添加需要的參數
我的項目中的UI圖是這樣的
代碼如下
子組件的模板設置
<template> <div class="completion-input-box"> <span class="input-box-name">{{text}}</span> <input type="text" ref="input" :value="value" @input="$emit('input', $event.target.value)" > </div></template><script>export default { name: 'inputlsit', props: ['text', 'value'],}</script>父組件模板
<template> <div class="completion-input-box"> <FromList :text="'創業項目名稱'" v-model="projectN"></FromList> <FromList :text="'所屬公司名稱'" v-model="companyN"></FromList> <FromList :text="'所屬投資機構名稱'" v-model="mechanismN"></FromList> </div></template><script>import FromList from './FromList.vue'export default { name: 'search', data() { return { projectN: '', // 創業項目名稱 companyN: '', // 所屬公司名稱 mechanismN: '' // 所屬機構名稱 } }, components: { FromList }}</script>如有疑問請留言或者到本站社區交流討論，感謝閱讀，希望能幫助到大家，謝謝大家對本站的支持！
新聞熱點
疑難解答
