• How do I initialize a dialog every time it is displayed? Add the :key attribute to the component that needs to be rerendered under the El-Dialog, then pass in a random number, which is reset in the event that is executed when cancel or confirm. So every time the dialog is opened, it is re-rendered. Data is the original value. I made the key timestamp. You can also add v-if as long as the value is the same as the visible. Sync binding
  • Format the timestamp of a column in a table
<el-table-column align="center" prop="updateTime" label="Update Time" :formatter="formatTime" show-overflow-tooltip></el-table-column>
Copy the code
formatTime(row, column){
  return this.getTimeFormat(row[column.property]);
}
getTimeFormat(timestamp) {
    if (timestamp && (typeof timestamp) === 'number') {
        var time = new Date(timestamp);
        var year = time.getFullYear();
        var month = time.getMonth() + 1;
        var date = time.getDate();
        var hours = time.getHours();
        var minutes = time.getMinutes();
        var seconds = time.getSeconds();
        return year + The '-' + this.add0(month) + The '-' + this.add0(date) + ' ' + this.add0(hours) + ':' + this.add0(minutes) + ':' + this.add0(seconds);
    } else {
        return ' '; }}Copy the code

Different column contents can be formatted in a similar way.

  • The export page is displayed. The binding method in VUE is as follows. In our project, TXT and PDF files will be exported separately, so I made a judgment on the export format
this.$http.get(URL,{responseType: 'arraybuffer'}).then(res => {
        this.download(res.data,'txt'); },res => {this.$message({
            message: 'Export failed! '.type: 'error'
        });
      });
download (data,exportType) {
      if(! data) {return
      }
      let exportGs=' ';
      if(exportType==='txt') {exportGs='text/plain';
      }else if(exportType==='pdf') {exportGs='application/pdf';
      }
      let url = window.URL.createObjectURL(new Blob([data],{type: exportGs}));
      let link = document.createElement('a')
      link.style.display = 'none'
      link.href = url;
      link.setAttribute('download'.'file');
      document.body.appendChild(link)
      link.click();
    }
Copy the code

At present, the format of exported TXT file is normal, the content of exported PDF file is empty, no content is written, it is being solved, if anyone has encountered similar problems, please let me know the solution, thank you very much.

  • The data transfer method using AXIOS is summarized as follows: 1. Use the GET method.
// Assume axios can already pass this.$httpQueryStr is the name received by the background, and queStr is the value this passed to the background.$http.get(URL,{params:{"queryStr":queStr}}). Then (res => {console.log(' returns information${res.data}`); },res => {console.log(' error message${res.data}`);
      });
Copy the code

2. Use the POST method.

let newServiceObj={
    "id": XXXXX} // Can pass an object this.$http.post(URL,newServiceObj).then(res => {console.log(' returns information${res.data}`); }, res => {console.log(' returns information${res.data}`);
});
Copy the code

3. Use the PUT method

let params=new URLSearchParams();
params.append("relatedIdsList",XXX);
params.append("servicesId",XXX);
this.$http.put(URL,params).then(res => {console.log(' returns information${res.data}`); }, res => {console.log(' returns information${res.data}`);
});
Copy the code

4. Use the delete method

this.$http.delete(URL+'? processInstIds='+XXX).then(res => {console.log(' returns information${res.data}`); }, res => {console.log(' returns information${res.data}`);
});
Copy the code

The project that lasted for more than a month has finally come to an end. I would like to record the problems encountered in the development in the past month in three articles, so as to facilitate future review and provide some help to others within my power.