vue单选框后缀文本框

你可以在Vue单选框组件中加入一个文本框作为后缀，例如：

<template>
  <div>
    <label v-for="(option, index) in options" :key="index">
      <input type="radio" :value="option.value" v-model="selectedOption">
      {{ option.label }}
    </label>
    <input type="text" v-model="suffixText">
  </div>
</template>

<script>
export default {
  data() {
    return {
      options: [
        { label: 'Option 1', value: 'option1' },
        { label: 'Option 2', value: 'option2' },
        { label: 'Option 3', value: 'option3' }
      ],
      selectedOption: null,
      suffixText: ''
    }
  }
}
</script>

这里我们使用了v-for指令来遍历选项，并使用v-model指令来绑定选中的选项和后缀文本框的值。注意，后缀文本框应该放在单选框组件的外层包裹元素中，以保证它是单选框的后缀而不是其中一个选项。