naive-ui/demo/documentation/components/popselect/enUS/customWidth.md
2020-02-04 15:10:51 +08:00

779 B

Custom Width

Set width of select menu.

<n-popselect
  v-model="value"
  :width="240"
  multiple
  :options="options"
  @change="handleChange"
>
  <n-tag>{{ (Array.isArray(value) && value.length) ? value : 'Popselect' }}</n-tag>
</n-popselect>
export default {
  data () {
    return {
      value: null,
      options: [{
        label: 'Go Let It Out',
        value: 'Go Let It Out'
      }, {
        label: 'Who Feels Love?',
        value: 'Who Feels Love?'
      }, {
        label: 'Sunday Morning Call',
        value: 'Sunday Morning Call',
        disabled: true
      }, {
        label: 'Roll It Over',
        value: 'Roll It Over'
      }]
    }
  },
  methods: {
    handleChange (v) {
      this.$NMessage.info('Value: ' + v)
    }
  }
}