关于vue 从API接口获取数据 重新赋值问题

在页面调试中，API接口拿到数据 重新赋data{suppliers:[]}值时，遇到了困难。
请大神们帮帮我，怎么实现这个效果，万分感谢！
api.js

import {  
    http  
} from './service.js'  
export default {  
/**  
     * 供应商查询  
     * @param {Object} params  
     */  
    supplierInfo(params) {  
        return http.post('index/supplierList', params)  
    },  
}

add.vue

<template>  
    <view class="container">  
        <form>  
            <view class="cu-form-group margin-top-sm">  
                <view class="title">设备名称:</view>  
                <input type="text" id="name" placeholder="请填写设备名称"></input>  
            </view>  
            <picker mode="selector" :range="suppliers" @change="pickerSupplier">  
                <view class="cu-form-group margin-top-sm">  
                    <view class="title">供应商:</view>  
                    <input placeholder="请选择设备供应商" id="supplier" placeholder-class="thorui-phcolor" :value="supplier" disabled/>  
                </view>  
            </picker>  
        </form>  
        <view class="cu-bar bg-white tabbar flex flex-wrap" @click="submit()">  
            <button class="bg-black submit basis-sm" style="border-radius: 0;">确认提交</button>  
        </view>  
    </view>  
</template>  

<script>  
    var _self  
    var flag = false  
    export default {  
        data() {  
            return {  
                content: '',  
                imgList: {  
                    fullurl: '',  
                    url: ''  
                },  
                suppliers:[],  
                supplier:[],  
            };  
        },  
        components: {  
        },  
        onLoad() {  
            _self = this  
            _self.getSupplierInfo();  
        },  
        methods: {  
            getSupplierInfo() {  
                _self.$api.supplierInfo().then((res) => {  
                    var lists = res.data  
                    lists.forEach(function(item, index) {  
                        console.log(item.name)  
                        _self.suppliers +=item.name;  
                    })                
                }).catch((err) => {  
                    _self.tui.toast(err.msg)  
                })  
            },  
            submit() {  
                uni.showLoading({  
                    title: '提交中...'  
                })  
                _self.$api.add({  
                    name: _self.name,  
                    supplier: _self.supplier  
                }).then((res) => {  
                    flag = false  
                    uni.hideLoading()  
                    _self.tui.toast('报修成功', '', 'success')  
                    setTimeout(function() {  
                        const eventChannel = _self.getOpenerEventChannel()  
                        eventChannel.emit('doRefresh', {  
                            ischange: true,  
                            type: 'register'  
                        })  
                        uni.navigateBack()  
                    }, 1500)  
                }).catch((err) => {  
                    flag = false  
                    uni.hideLoading()  
                    _self.tui.toast(err.msg)  
                })  
            }  
        }  
    }  
</script>  
<style lang="scss">  
    page {  
        background-color: #f1f1f1;  
    }  

    .cu-bar.tabbar {  
        position: fixed;  
        width: 100%;  
        left: 0;  
        bottom: 0;  
    }  
</style>

接口返回数据

{  
  "code": 1,  
  "msg": "",  
  "time": "1678935614",  
  "data": [  
    {  
      "id": 1,  
      "supplier_code": "GYS-0001",  
      "name": "AAAA公司",  
      "remark": "",  
      "status": "normal",  
      "createtime": 1669690703,  
      "updatetime": 1677578692,  
      "deletetime": null  
    },  
    {  
      "id": 2,  
      "supplier_code": "GYS-0002",  
      "name": "BBBB公司",  
      "remark": "",  
      "status": "normal",  
      "createtime": 1669690738,  
      "updatetime": 1677578733,  
      "deletetime": null  
    },  
    {  
      "id": 3,  
      "supplier_code": "GYS-0003",  
      "name": "其他供应商",  
      "remark": "",  
      "status": "normal",  
      "createtime": 1677578792,  
      "updatetime": 1677578792,  
      "deletetime": null  
    }  
  ]  
}

console

页面渲染效果

想实现效果