# namespaceId

迎合自动化 UI 测试，针对元素标记唯一 id。最终 id 为项目代号（项目名）+ 页面名 + 传入的 id，以中划线 "-" 连接。

# Usage

## Step1. 入口配置

```typescript
// main.ts
import { namespaceId } from '@kt/unity-plugins';
// ...

// 使用 namespaceId 插件，并传入当前应用名称
app.use(namespaceId, { appName: 'test' });
```

## Step2. 页面使用

### 模版使用

```html
<template>
  <a-form :id="$id('form')">
    <a-form-item label="姓名">
      <a-input :id="$id('name')" placeholder="请输入姓名" />
    </a-form-item>

    <a-form-item label="性别">
      <a-select :id="$id('sex')" placeholder="请选择性别">
        <a-select-option value="male">男</a-select-option>
        <a-select-option value="female">女</a-select-option>
      </a-select>
    </a-form-item>

    <a-form-item label="单选">
      <a-radio :id="$id('radio')" v-model:checked="form.checked">单选</a-radio>
    </a-form-item>
  </a-form>
</template>
```

### js 使用 hook

```html
<script lang="ts" setup>
  import { onMounted } from 'vue';
  import { useNamespaceId } from '@kt/unity-plugins';
  const { id } = useNamespaceId();
  onMounted(() => {
    const dom = document.getElementById(id('form'));
    console.log('dom :>> ', dom);
  });
</script>
```
