<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://cdn.uv.cc/vue/3.5.13/vue.global.prod.js"></script>
</head>
<body>
<div id="app">
<div>
<input ref="inputElement" type="text" placeholder="请输入内容" />
<button @click="focusInput">聚焦输入框</button>
</div>
</div>
<script>
const { createApp, ref, computed, onMounted } = Vue;
// 创建一个 Vue 组件
const App = {
setup() {
// 使用 ref 创建一个输入框的引用
const inputElement = ref(null);
// 聚焦输入框的函数
const focusInput = () => {
inputElement.value.focus();
};
return {
inputElement,
focusInput
};
}
};
// 创建并挂载 Vue 应用
createApp(App).mount('#app');
</script>
</body>
</html>