docs(projects): 文档更新

doc/vue书写规范.md

@@ -0,0 +1,209 @@
+### script-setup写法
+
+#### 第一部分
+
+##### template
+
+#### 第二部分
+
+##### script
+
+##### 一、import的顺序, 依次按照下面的顺序。
+
+1. vue模块
+
+   ```typescript
+   import {  } from 'vue';
+   ```
+
+2. vue相关类型
+
+   ```typescript
+   import type {  } from 'vue';
+   ```
+
+3. vue-router模块
+
+   ```typescript
+   import {  } from 'vue-router';
+   ```
+
+4. vue-router相关类型
+
+   ```typescript
+   import type {  } from 'vue-router';
+   ```
+
+5. UI框架模块
+
+   ```typescript
+   import {  } from 'naive-ui';
+   ```
+
+6. UI框架相关类型
+
+   ```typescript
+   import type {  } from 'naive-ui';
+   ```
+
+7. 第三方依赖
+
+   ```typescript
+   import BScroll from 'bscroll';
+   ```
+
+8. 第三方依赖相关类型
+
+   ```typescript
+   import type {  } from 'bscroll';
+   ```
+
+9. @/enum
+
+   ```typescript
+   import {  } from '@/enum';
+   ```
+
+10. @/setting
+
+    ```typescript
+    import {  } from '@/setting';
+    ```
+
+11. @/plugins
+
+    ```typescript
+    import {  } from '@/plugins';
+    ```
+
+12. @/layouts
+
+    ```typescript
+    import {  } from '@/layouts';
+    ```
+
+13. @/views
+
+    ```typescript
+    import {  } from '@/views';
+    ```
+
+14. @/components
+
+    ```typescript
+    import {  } from '@/components';
+    ```
+
+15. @/hooks
+
+    ```typescript
+    import {  } from '@/hooks';
+    ```
+
+16. @/store
+
+    ```typescript
+    import {  } from '@/store';
+    ```
+
+17. @/context
+
+    ```typescript
+    import {  } from '@/context';
+    ```
+
+18. @/router
+
+    ```typescript
+    import {  } from '@/router';
+    ```
+
+19. @/service
+
+    ```typescript
+    import {  } from '@/service';
+    ```
+
+20. @/utils
+
+    ```typescript
+    import {  } from '@/utils';
+    ```
+
+21. @/interface
+
+    ```typescript
+    import {  } from '@/interface';
+    ```
+
+22. @/assets
+
+    ```typescript
+    import {  } from '@/assets';
+    ```
+
+23. 相对路径依赖
+
+    ```typescript
+    import {  } from './components';
+    ```
+
+##### 二、TS类型声明
+
+```typescript
+interface Props {
+	/**姓名 */
+  name: string;
+	/**年龄 */
+  age?: number;
+}
+interface Emits {
+  /**
+   * 删除事件
+   * @param id - 删除项的id
+   */
+	(e: 'delete', id: number): void;
+}
+```
+ 
+
+##### 三、defineProps、defineEmits、withDefaults
+
+1. 定义属性，如：
+
+```typescript
+const props = withDefaults(defineProps<Props>(), {
+  age: 24
+});
+```
+
+其中name是必须的属性，age是可选属性，通过withDefaults添加默认值
+
+2. 定义emit事件
+
+```typescript
+const emit = defineEmits<Emits>();
+```
+
+##### 四、响应式use函数
+
+有些use函数需要传入响应式的变量参数时，则书写在声明的变量下面。
+
+```typescript
+const router = useRouter();
+const route = useRoute();
+```
+
+```typescript
+/**dom引用 */
+const domRef = ref<HTMLElement | null>(null);
+const { height: domRefHeight } = useElementSize(domRef); //获取domRef的响应式高度
+```
+
+
+
+##### 五、变量、函数声明
+
+##### 六、vue生命周期函数、nextTick执行
+
+##### 七、defineExpose