循环的input根据input是否有值来改变他的样式

ui设计的是文本框文未输入数据时文本居中，有内容之后文本框的数据向右对齐，并且文本加粗，同时这组input框是根据加减按钮控制增减的具体如下
wxml

<form bindsubmit="formSubmit">
     <view class='to-flex-center-between  padding-bottom-Mid-big'>
              <view class='font-size-mid-big margin-right-small'>乘车人数</view>
              <view class='to-flex-center '>
                <image src='/images/reduce.png' style='width:52rpx;' mode='widthFix' bindtap='reducePassenger'></image>
                <view style='width:40rpx;' class='text-align font-weight-bold'>{{ passengerNumber }}</view>
                <image src='/images/add.png' style='width:52rpx;' mode='widthFix' bindtap='addPassenger'></image>
              </view>
            </view>

  <view class='to-flex-center-between padding-top-bottom-Mid-big border-top-EFF1F4' wx:for='{{ passengerInput }}' wx:key='index'>
              <view class='font-size-mid-big margin-right-small'>同乘人姓名</view>
              <input class='font-size-mid-big  {{item.name?"font-weight-bold":"font-weight-normal"}}' type='text' name='fPassenger{{index}}' placeholder='点击输入姓名' cursor-spacing='140' placeholder-style='color:#C5C9D2 ' bindinput='bindInputData' data-index='{{ index }}'
                style='text-align:{{item.name?"right":"left"}}'></input>
            </view>
 <view class='to-fixed bkg-EFF1F4 font-weight-bold padding-top-middle  {{ isIphoneX?"bottom50":"bottom0" }} wrap-width-normal' style='z-index:10'>
          <view class='btn  btn-confirm margin-auto   {{contentChange?"bkg-00C1C1":""}}'>
            <button class='color-white font-size-mid-big' style='line-height:120rpx;border:0 none;padding:0;border-radius:60rpx;' form-type='submit' hover-class='detail-hover'>确认信息并登记</button>
          </view>
        </view>
</form>

因为用的公共样式这块就不贴了
js部分

data: {
    passengerNumber: 1, //默认的人数
    passengerInput: [],//用来循环input框的数据
}
  // 修改乘车人数增加
  addPassenger: function() {
    if (this.data.passengerNumber >= 4) {
      wx.showToast({
        title: '已到达上限咯',
        icon: 'none'
      })
      return
    }
    this.setData({
      passengerNumber: ++this.data.passengerNumber,
    })
    var arr = []
    if (this.data.passengerNumber > 1) {
     
      console.log(this.data.passengerInput)
        this.data.passengerInput.push({ name: '', id: '' })

      console.log(this.data.passengerInput)
      // console.log(this.data.passengerInput)
      this.setData({
        passengerInput: this.data.passengerInput
      })
    }
  },
  // 修改人数减少
  reducePassenger: function() {
    if (this.data.passengerNumber == 1) {
      wx.showToast({
        title: '不能再少啦',
        icon: 'none'
      })
      this.setData({
        passengerInput: []
      })

    } else if (this.data.passengerNumber > 1) {
      this.setData({
        passengerNumber: --this.data.passengerNumber,
        passengerInput: this.data.passengerInput.splice(0, this.data.passengerInput.length-1)
      })
    }
  }
   // 填写乘车人数的信息
  bindInputData: function (e) {
    let val = e.detail.value
    var id = e.currentTarget.dataset.index
    this.data.passengerInput.forEach((item, index) => {
      if (id == index) item.name = val
    })
    this.setData({
      passengerInput: this.data.passengerInput
    })
  },
//这input框是循环的，在提交数据的时候需要根据效验用户是否信息填写完整 代码如下
  // 提交数据
  formSubmit: function(e) {
    let _this = this
    console.log(e, '绑定数据')
    let val = e.detail.value
    var valList = []
    if (val) {
      for (let item in val) {
        if (val[item]) {
          valList.push(val)
        }
      }
    }
  //  这样拿到的就是已填写了数据的input的数据 没有的我们可提示用户
  },