Skip to content

defineCustomElement - no way to provide props declaration #11116

Closed
@qcp

Description

@qcp

Vue version

3.4.27

Link to minimal reproduction

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

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions