mirror/naive-ui
2
0
Fork 0
mirror of https://github.com/tusen-ai/naive-ui.git synced 2024-12-27 05:00:48 +08:00
Code Issues Packages Projects Releases Wiki Activity
d0e94f9c83
naive-ui/demo/documentation/components/input/zhCN/icon-debug.demo.md
07akioni 487001d697 build: add changelog to site, refactor loader based on suffix 
.demo.md for component demo
.demo-entry.md for demo entry
.md for common docs
2020-08-19 23:30:04 +08:00

2.2 KiB
Raw Blame History

图标

添加图标

<n-input v-model="value" placeholder="搜索" clearable>
  <template v-slot:prefix>
    <n-icon>
      <md-search/>
    </n-icon>
  </template>
</n-input>
<n-input v-model="value" placeholder="搜索" clearable>
  <template v-slot:suffix>
    DOLLAR
  </template>
</n-input>
<n-input v-model="value" round placeholder="搜索" size="small" clearable>
  <template v-slot:suffix>
    <n-icon>
      <md-search/>
    </n-icon>
  </template>
  <template v-slot:prefix>
    <n-icon>
      <md-search/>
    </n-icon>
  </template>
</n-input>
<n-input v-model="value" placeholder="搜索" size="large" clearable>
  <template v-slot:suffix>
    <n-icon>
      <md-search/>
    </n-icon>
  </template>
  <template v-slot:prefix>
    <n-icon>
      <md-search/>
    </n-icon>
  </template>
</n-input>
<n-input v-model="value" placeholder="搜索" size="small" clearable>
  <template v-slot:suffix>
    <n-icon>
      <md-search/>
    </n-icon>
  </template>
  <template v-slot:prefix>
    <n-icon>
      <md-search/>
    </n-icon>
  </template>
</n-input>
<n-input v-model="value" placeholder="搜索" pair size="large" separator="-" clearable>
  <template v-slot:suffix>
    <n-icon>
      <md-search/>
    </n-icon>
  </template>
  <template v-slot:prefix>
    <n-icon>
      <md-search/>
    </n-icon>
  </template>
</n-input>
<n-input v-model="value" placeholder="搜索" pair size="small" separator="-" clearable>
  <template v-slot:suffix>
    <n-icon>
      <md-search/>
    </n-icon>
  </template>
  <template v-slot:prefix>
    <n-icon>
      <md-search/>
    </n-icon>
  </template>
</n-input>
<n-input v-model="value" round placeholder="搜索" size="large" clearable>
  <template v-slot:suffix>
    <n-icon>
      <md-search/>
    </n-icon>
  </template>
  <template v-slot:prefix>
    <n-icon>
      <md-search/>
    </n-icon>
  </template>
</n-input>
<n-input v-model="value" round placeholder="搜索" clearable>
  <template v-slot:suffix>
    <n-icon>
      <md-search/>
    </n-icon>
  </template>
</n-input>

import mdSearch from 'naive-ui/lib/icons/md-search'

export default {
  components: {
    mdSearch
  },
  data() {
    return {
      value: null
    }
  }
}

.n-input {
  margin-bottom: 8px;
}