types: Adding BfFrom Component types

.vscode/extensions.json

@@ -1,3 +1,3 @@
 {
-  "recommendations": ["johnsoncodehk.volar", "lokalise.i18n-ally"]
+  "recommendations": ["johnsoncodehk.volar", "lokalise.i18n-ally", "esbenp.prettier-vscode"]
 }

package.json

@@ -27,6 +27,7 @@
   "dependencies": {
     "@vueuse/core": "^7.1.2",
     "element-plus": "1.2.0-beta.6",
+    "lodash-es": "^4.17.21",
     "pinia": "^2.0.6",
     "vue": "^3.2.24",
     "vue-i18n": "9.1.9",

src/App.vue

@@ -1,11 +1,31 @@
 <script setup lang="ts">
+import { ref, onMounted, unref } from 'vue'
 import { ElConfigProvider } from 'element-plus'
 import zhCn from 'element-plus/lib/locale/lang/zh-cn'
 // import en from 'element-plus/lib/locale/lang/en'
+import { BfFrom, BfFormExpose } from '@/components/Form'
+const formRef = ref<InstanceType<typeof BfFrom> & BfFormExpose>()
+
+onMounted(() => {
+  const form = unref(formRef.value)
+  console.log(form?.count)
+  form?.sayHello()
+  console.log(form?.$el)
+
+  const schema: BfFormSchema = [
+    {
+      field: '1',
+      colProps: {}
+    }
+  ]
+  console.log(schema)
+})
 </script>
 
 <template>
   <ElConfigProvider :locale="zhCn">
-    <RouterView class="app" />
+    <BfFrom ref="formRef" />
+    <Component :is="BfFrom" />
+    <!-- <RouterView class="app" /> -->
   </ElConfigProvider>
 </template>

src/components/Form/index.ts

@@ -1,3 +1,8 @@
 import BfFrom from './src/BfForm.vue'
 
+export interface BfFormExpose {
+  count: number
+  sayHello: () => void
+}
+
 export { BfFrom }

src/components/Form/src/BfForm.vue

@@ -1,6 +1,12 @@
-<script lang="ts" setup>
+<script lang="tsx" setup>
+// import { ref } from 'vue'
+// import { ElCol, ElRow } from 'element-plus'
 // import { propTypes } from '@/utils/propTypes'
-// import { array } from 'vue-types'
+import { array } from 'vue-types'
+
+defineProps({
+  schema: array<BfFormSchema>()
+})
 </script>
 
 <template>