может быть удален

ришлось выбрать вариант повторителя.

Что я хочу, так это то, что когда я выбрал johndoe при первом выборе, он больше не будет отображаться при втором выборе.

вот мой HTML

<div id="app">
  <h1>Vue JS Multiple Fields Repeater</h1>
          <div class="col-sm-6">
            <div class="panel panel-default relative has-absolute" v-for="(field, index) in users.usersRepeater">
              <button @click="addUsersField" type="button">
                Add
              </button>
              <button @click="deleteUsersField(index)" v-if="field != 0" type="button">
                Delete
              </button>
              <div class="panel-body has-absolute">
                <div class="form-group">
                  <label for="users" class="control-label col-sm-3 text-left">Users {{field}}</label>
                    <select :name="'users'+index"
                      class="form-control"
                      id="users">
                        <option value="" hidden>Select User</option>
                        <option value="1">John Doe</option>
                        <option value="2">Mark Doe</option>
                        <option value="3">Mae Doe</option>
                        <option value="4">John Smith</option>
                        <option value="5">Mae Smith</option>
                    </select>
                </div>
              </div>
            </div>
          </div>
</div>

вот мой vue.js

new Vue({
  el: '#app',
  data: {
    users: {
          usersRepeater: [{ user: '' }]
        }
  },
  methods: {
      addUsersField: function() {
        this.users.usersRepeater.push({
          user: ''
        });
      },
      deleteUsersField: function(index) {
        this.users.usersRepeater.splice(index, 1);
      },
  }
});

вот скрипка ->https://jsfiddle.net/0e3csn5y/23/

 samayo24 нояб. 2017 г., 11:34
создайте другой список, чтобы сохранить выбранных пользователей или, что еще лучше, добавьте еще одно свойство в isSelected в свой список пользователей ...
 bbsimonbb28 нояб. 2017 г., 14:52
Этотпакет npm может быть полезно для вас. Похоже, он делает именно то, что вы ищете.
 JSmith24 нояб. 2017 г., 11:32
Я уже обновил скрипку ->jsfiddle.net/0e3csn5y/23
 samayo24 нояб. 2017 г., 10:32
Вы не должны жестко кодировать список пользователей внутри вашего HTML
 samayo24 нояб. 2017 г., 11:18
возможно это поможет немногоjsfiddle.net/943bx5px/2 я могу это сделать, но сейчас у меня нет времени

Ответы на вопрос(2)

этот очень полезно.

 Mogsdad10 янв. 2018 г., 15:12
Хотя эта ссылка может предоставить некоторую ограниченную, немедленную помощь, ответдолжен включать достаточный контекст вокруг ссылки так что ваши коллеги-пользователи будут иметь некоторое представление о том, что это такое и почему оно там. Всегда цитируйте наиболее важную часть важной ссылки, чтобы сделать ее более полезной для будущих читателей с другими, похожими вопросами. Кроме того, другие пользователи склонны отрицательно отвечать на ответы, которыечуть больше, чем ссылка на внешний сайт, И ониможет быть удален.

Хорошо у меня это работает сейчас. Мне понравился вопрос, потому что сделать упорядоченный выбор - это общий случай. Но для меня все равно это было не так просто. Прорывом стало понимание того, что при нумерации вариантов все состояние компонента может быть заключено в один массив,allUsers, Доступные пользователи и варианты выбора становятся вычисляемыми свойствами на основе этого массива. Мораль истории: сделайте ваш магазин правильным, без взаимодействия между элементами магазина.

Мой ответ весит 130 строк. Как долго и тяжело было бы это без Vue? Уму непостижимо.

Stack хочет, чтобы я опубликовал некоторый код, поэтому вот вычисляемое свойство, которое генерирует массив вариантов, сделанных в порядке их приоритета из массива all users ...

choices(){
    return this.store.allUsers.map((aUser,index)=>{
    if(aUser.selection != null)
        return {idxAllUsers : index, selection: aUser.selection};
    else
        return null;
  })
  .filter(aSelection=>aSelection != null)
  .sort((a,b)=>{return a.selection - b.selection})
  .map(a=>a.idxAllUsers);
},
 JSmith24 нояб. 2017 г., 11:35
Я не могу добавить новую опцию выбора
 JSmith24 нояб. 2017 г., 13:14
в любом случае это не полезно
 bbsimonbb01 февр. 2018 г., 15:18
@JSmith Вы когда-нибудь продвигались с этим?Мой jsfiddle решение все еще работает отлично, по мне.
 bbsimonbb24 нояб. 2017 г., 11:51
Еще несколько обновлений скрипки. Массив selectedUsers обновляется, но пока не отображается должным образом. Монстр вопрос.

Ваш ответ на вопрос