Vue - 打印数组

时间:2018-03-07 12:32:45

标签: javascript json vue.js vuejs2 vue-component

我有这个模型npm uninstall -g composer-playground我有一个npm uninstall -g composer-playground npm install -g composer-playground npm ls -g --depth==0 |grep playground 的属性,里面有一个数组files,在我的Vue组件中,我想逐个显示错误,而不是数组格式。

有什么办法吗?

response

errorMessages

2 个答案:

答案 0 :(得分:2)

您需要遍历errorMessages数组

<ul v-if="files.length">
  <li v-for="(file, index) in files" :key="file.id">
    <span>{{file.name}}</span> -
    <span v-if="file.error"> 
      <ol>
       <li v-for="err in file.response.errorMessages> {{ err }} </li>
      </ol>
    </span>
  </li>
</ul>

或者使用数组的.join方法(['hola', 'mundo'].join(", ") => 'hola, mundo'

<span v-if="file.error">{{ file.response.errorMessages.join(", ") }}</span>

答案 1 :(得分:1)

    {
  "files": [
    {
      "fileObject": true,
      "size": 9387,
      "name": "file_4444.pdf",
      "type": "application/pdf",
      "active": false,
      "error": true,
      "success": true,
      "postAction": "http://localhost:8000/api/v1/car/upload",
      "timeout": 0,
      "file": {},
      "el": {
        "__vue__": null
      },
      "response": {
        "uploadDone": 0,
        "uploadFail": 1,
        "errorMessages": [
          "User not found",
          "Car not found",
        ]
      },
      "progress": "100.00",
      "speed": 9591,
      "data": {},
      "headers": {},
      "id": "096vnj6rov9t",
      "xhr": {}
    }
  ]
}