代码

demo\src\App.vue
    <script setup>
        import { ref } from 'vue'
        
        const name = ref('')
        const password = ref('')
        const content = ref('邓瑞编程')
        const url = ref('dengruicode.com')
        const url2 = ref('dengruicode')
        const email = ref('123456')

        //const selected = ref('')
        const selected = ref('2') //选中的下拉框
    </script>

    <template>
        <div style="width: 300px;">
            <!-- clearable 可一键清空 -->
            <h3>输入框</h3>
            <el-input v-model="name" clearable placeholder="请输入用户名" />

            <!-- show-password 可切换显示隐藏密码 -->
            <h3>密码框</h3>
            <el-input v-model="password" show-password placeholder="请输入密码" />

            <h3>文本域</h3>
            <el-input type="textarea" v-model="content" rows="2" />

            <h3>输入内容长度限制 - 输入框</h3>
            <el-input v-model="name" maxlength="10" show-word-limit />

            <h3>输入内容长度限制 - 文本域</h3>
            <el-input type="textarea" v-model="content" maxlength="20" rows="3" show-word-limit />

            <h3>尺寸</h3>
            大 <el-input size="large" />
            默认 <el-input />
            小 <el-input size="small" />

            <h3>前置</h3>
            <el-input v-model="url">
                <template #prepend>https://</template>
            </el-input>

            <h3>后置</h3>
            <el-input v-model="email">
                <template #append>@qq.com</template>
            </el-input>

            <h3>前置后置</h3>
            <el-input v-model="url2">
                <template #prepend>https://</template>
                <template #append>.com</template>
            </el-input>

            <h3>前置后置扩展 - 搜索</h3>
            <el-input placeholder="请输入课程名称">
                <template #prepend>
                    <el-select v-model="selected" placeholder="请选择" style="width: 100px;">
                        <el-option label="前端" value="1" />
                        <el-option label="后端" value="2" />
                        <el-option label="服务端" value="3" />
                    </el-select>
                </template>
                <template #append>
                    <el-button>
                        <el-icon><Search /></el-icon>
                    </el-button>
                </template>
            </el-input>
        </div>
    </template>

    <style scoped>

    </style>