Vue 视图与数据不统一问题

这里记录的是 vue视图与data中数据不一致的 问题希望可以帮到你，上代码。 做的是一个选择框在后端有数据的情况下复现的功能

<Select
            size="large"
            style="margin-bottom:10px;"
            class="common-select-multiple"
            filterable
            v-model="joinPerson[0].userId"
            @on-change="selectJoinPerson($event,0)"
          >
            <Option
              v-for="(item) in cityList"
              :key="item.userId"
              :value="item.userId"
            >{
  { item.userName}}</Option>
          </Select>

export default {
  data() {
    return {
      joinPerson: [{        
        userId: '0001'
      },{
        userId: '0001'
      },{
        userId: '0001'
      }],
created(){
            //获取已选择的数据
init(){
    this.$axios(data).then(res =>{
    this.joinPerson =res.data
Vue.set(this.joinPerson,0,res.