The problem of element UI select creating new data

<el-select
    v-model="pawnForm.assetsId"
    filterable
    allow-create
    default-first-option
    placeholder=""
    class="el-element--custom"
    @change="assetChange">
<el-option
        v-for="item in assets"
        :key="item.id"
        :label="item.name"
        :value="item.id">
</el-option>
</el-select>

assetChange(val) {
    console.log(val);
    this.assets.forEach(item => {
        // console.log(item);
        if (val === item.id) {
            this.pawnForm.name = item.name;
            this.pawnForm.assetsId = item.id;
            this.pawnForm.assetsType = Number(item.assetsType);
        } else if (val !== item.id) {
            this.pawnForm.name = val;
            this.pawnForm.assetsId = "0";
            this.pawnForm.assetsType = "";
        }
    })
    console.log(this.pawnForm);
}

create a new data when the id is equal and the asset id is not equal
but if you do so, the assetsId is always 0
is there any solution