defineCustomElement - no way to provide props declaration (original) (raw)

Vue version

3.4.27

https://stackblitz.com/edit/vitejs-vite-zprxq6?file=src%2FApp.tsx

Steps to reproduce

  1. Run dev server
  2. Open ./src/App.tsx
  3. Look at CE components exempleOneCe and exempleTwoCe
  4. Match with preview, exempleOneCe - lose props, exempleTwoCe - has props

What is expected?

With syntax:

defineCustomElement<Props>(
    (props) => { return () => (<b>{props.text}</b>)},
)

exempleOneCe - on stackblitz

I expect to get props value inside setup by default.

OR

I expect to provide props declaration like in defineComponent.

What is actually happening?

I couldn't get props value with this syntax.

I couldn't provide props declaration.

Only way to do use props, is use this syntax only:

defineCustomElement({
    setup(props) { return () => (<b>TWO TEXT: {props.text}</b>)},
    props: {
        text: { type: String, required: true }
    }
})

exempleTwoCe - on stackblitz

System Info

System: OS: Linux 5.15 Ubuntu 22.04.3 LTS 22.04.3 LTS (Jammy Jellyfish) CPU: (8) x64 11th Gen Intel(R) Core(TM) i5-1135G7 @ 2.40GHz Memory: 5.95 GB / 7.54 GB Container: Yes Shell: 5.1.16 - /bin/bash Binaries: Node: 20.12.0 - ~/.nvm/versions/node/v20.12.0/bin/node npm: 10.8.1 - ~/.nvm/versions/node/v20.12.0/bin/npm npmPackages: vue: ^3.4.27 => 3.4.27

Any additional comments?

image