Vue.directive('let', { bind(el, binding, vnode) { const ComponentConstructor = Vue.extend({ render(createElement) { // render函数可以访问this.$slots.default return createElement('div', this.$slots.default); }, }); const componentInstance = new ComponentConstructor({ // 使用data函数来定义响应式数据 data() { return typeof binding.value === 'function' ? binding.value() : { value: binding.value }; }, }); // 挂载到一个临时元素上 const mountNode = document.createElement('div'); componentInstance.$mount(mountNode); // 替换绑定元素的内容 el.innerHTML = ''; el.appendChild(componentInstance.$el); }, }); 自定义指令的类型声明: declare module 'vue' { interface ComponentCustomProperties { 'v-let': any; } }