Skip to content

useLayer

createLayer 的返回值,不是 vue-layerx 的独立导出。

ts
function useLayer(
  Content?: Component,
  config?: MaybeRefOrGetter<LayerConfigContent>,
): LayerInstance

参数

参数说明
Content内容组件;可省略(只要容器、暂无业务体时)
config创建实例时的默认配置;顶层 props内容;可为响应式源
ts
const dialog = useDialog(UserForm, {
  props: { mode: 'edit' },
})

// 响应式默认
const id = ref('1')
const dialog = useDialog(UserForm, () => ({
  props: { recordId: id.value },
}))

省略 Content(仅容器)

ts
const shell = useDialog()
shell.open({
  container: { props: { title: '仅容器' } },
})

容器的配置请显式写在 container:。这不是「Dialog+表单写在一个文件里还没拆开」——那种情况见 容器与内容未拆分(内容里 defineLayer({ component: LayerNoContainer }))。

返回值

LayerInstance。在 setup 内创建时会自动尝试 bindHost()

与 open 的关系

  • 创建实例时的配置:可保持响应式
  • open(config?):当次 普通对象快照(不要传函数);空 open() 使用当前实例默认配置

指南:打开与关闭

MIT Licensed