自定义指令（全局和局部作用）

自定义指令分为两个字情景
1.在某一个vue文件里，而不是全局
2.在main.ts文件里注册全局的自定义指令
vue文件

<script setup>
import {ref,onMounted} from 'vue'
let n =ref(1)
const vFocus={
    mounted:(element)=>{
        element.focus()
    }
}
</script>
<template>
<!-- 定义一个v-big指令，类似于v-text指令 -->
    <div id="container">
        <h2>当前的n值:<span v-text="n"></span></h2>
        <h2>放大10倍后的效果<span v-big="n"></span></h2>
        <button @click="n++">点击+1</button>
    </div>
    <!-- 定义一个v-focus指令，和v-bind功能类似，
    但可以让其所绑定的input默认获得焦点 -->
    <div >
        <input type="text" v-focus:value="n"/>
    </div>
</template>

main.ts文件中
app.directive('big', (element,binding) => {
    element.innerText=binding.value*10
})