fix: 支持 data-*

Author: agileago

example/module/basic/simple-component/index.view.tsx

@@ -31,15 +31,20 @@ export const SimpleStateComponent = defineComponent(
 export const SimpleStateWithDefaultValueComponent = defineComponent(
   function SimpleStateWithDefaultValueComponent(
     props: SimpleStateComponentProps,
+    { attrs },
   ) {
     const classAndStyle = useClassAndStyle()
     const count = ref(props.initialValue || 0)
-    return () => (
-      <div {...classAndStyle}>
-        <h3>带默认属性参数的组件</h3>
-        <input type={'number'} v-model={count.value} />
-      </div>
-    )
+    return () => {
+      console.log(2222, props.initialValue, attrs)
+      console.log(3333, { ...props })
+      return (
+        <div {...classAndStyle} {...props}>
+          <h3>带默认属性参数的组件</h3>
+          <input type={'number'} v-model={count.value} />
+        </div>
+      )
+    }
   },
   {
     props: {
@@ -55,13 +60,23 @@ export const SimpleStateWithDefaultValueComponent = defineComponent(
 
 // 简单状态组件定义
 const SimpleComponent = defineComponent(() => {
+  const init = ref<undefined | number>(10)
+
   return () => (
     <div>
       <h2>简单组件定义</h2>
       <h3>函数组件</h3>
       <SimpleFuncComponent count={20}></SimpleFuncComponent>
       <SimpleStateComponent initialValue={10}></SimpleStateComponent>
-      <SimpleStateWithDefaultValueComponent></SimpleStateWithDefaultValueComponent>
+      <button onClick={() => (init.value = init.value ? undefined : 10)}>
+        切换默认值
+      </button>
+      <SimpleStateWithDefaultValueComponent
+        class={'aaaa'}
+        initialValue={init.value}
+        // @ts-ignore
+        data-a={1111}
+      ></SimpleStateWithDefaultValueComponent>
     </div>
   )
 })

example/module/basic/user-input/user-input.view.tsx

@@ -19,7 +19,7 @@ export default class UserInputView extends VueComponent {
     return (
       <Card title={'增删改查'}>
         <div>
-          <Button type={'primary'} onClick={this.add}>
+          <Button type={'primary'} onClick={this.add} data-a={'111'}>
             增加
           </Button>
         </div>

src/simple-props/composables.ts

@@ -7,7 +7,11 @@ import {
 } from 'vue'
 
 export function camelizePropKey(p: string | symbol): string | symbol {
-  return typeof p === 'string' ? camelize(p) : p
+  if (typeof p === 'string') {
+    if (p.startsWith('data-')) return p
+    return camelize(p)
+  }
+  return p
 }
 
 export function useProps<T>(): T {
@@ -20,7 +24,7 @@ export function useProps<T>(): T {
   const getProps = () => {
     return Object.fromEntries(
       Object.entries(instance.vnode.props || {}).map(([k, v]) => [
-        camelize(k),
+        camelizePropKey(k),
         v,
       ]),
     )
@@ -47,6 +51,7 @@ export function useProps<T>(): T {
       ownKeys() {
         return [
           ...new Set([
+            ...Reflect.ownKeys(instance.props),
             ...Reflect.ownKeys(getProps()),
             ...Reflect.ownKeys(slots).map((k) =>
               typeof k === 'string' ? camelize(`render-${k}`) : k,