在Vuejs中读取HTML响应以在对话框

时间:2018-02-21 13:11:12

标签: javascript vue.js vuejs2 vuetify.js

我从服务器获得HTML格式的REST请求的响应。我把它存储在一个数据中:[]当我在控制台上打印它时,它看起来像是HTML。这个回复是一个字符串,现在我的问题是在JavaScript中过滤它以使其成为一个对象数组

 <table border='1' frame = 'void'>
    <tr>
    <th>name</th>
    <th>age</th>
    <th>date of birth</th>
    </tr>
    <tr>
     <td>John</td>
     <td>30</td>
     <td>10.09.1987</td>
    </tr>
    </table>

我的问题是如何在使用vuejs的对话框中显示此HTML数据。 我想将这些值作为像这样的对象数组

   [
     name,
     age,
     data of birth,
    john,
    30,
    10.09.1987
   ]

1 个答案:

答案 0 :(得分:1)

这不是Vue.js问题,而是HTML / JavaScript问题。您可以迭代单元格文本内容并转换为如下所示的数组。

&#13;
&#13;
var stringFromREST = "<table border='1' frame='void'><tr><th>name</th><th>age</th><th>date of birth</th></tr><tr><td>John</td><td>30</td><td>10.09.1987</td></tr></table>";

var tempDiv = document.createElement('div');
tempDiv.innerHTML = stringFromREST;

var cells = tempDiv.querySelectorAll('th,td');

var contentArray = [];
for (var i = 0; i < cells.length; i++) {
  contentArray.push(cells[i].innerText);
}

console.log(contentArray);
&#13;
&#13;
&#13;