上代码就完了
这里输入ping地址, 次数,包大小
<el-row>
<el-col :span="6" :xs="24" :sm="24" :md="24" :lg="12" :xl="6">
<span style="display: inline-block">ping:</span>
<span style="display: inline-block"
><el-input placeholder="请输入IP地址" v-model="ping"> </el-input
></span>
</el-col>
<el-col :span="6" :xs="24" :sm="24" :md="24" :lg="12" :xl="6">
<span style="display: inline-block">次数:</span>
<span style="display: inline-block"
><el-input placeholder="请输入次数" v-model="cishu"> </el-input
></span>
</el-col>
<el-col :span="8" :xs="24" :sm="24" :md="24" :lg="12" :xl="8">
<span style="display: inline-block">包大小(Byte):</span>
<span style="display: inline-block"
><el-input placeholder="请输入包大小" v-model="size"> </el-input
></span>
</el-col>
<el-col :span="3" :xs="24" :sm="24" :md="24" :lg="12" :xl="3">
<el-button type="primary" style="" @click="componentDidMount"
>确定</el-button
>
</el-col>
</el-row>
componentDidMount() {
this.rizhi_con = "";
let url =
"/ping?ip=" + this.ping + "&count=" + this.cishu + "&size=" + this.size;
var self = this;
var f = (r) => {
return r.read().then(function (result) {
var data = String.fromCharCode.apply(null, result.value);
self.rizhi_con += data;
// self.setState({ live }); // Append live log
if (!result.done) f(r); // Read next chunk
});
};
// console.log(object);
fetch(url)
.then((r) => r.body.getReader())
.then(f);
},
wangluo() {
let url =
"/ping?ip=" + this.ping + "&count=" + this.cishu + "&size=" + this.size;
fetch(url, {
method: "POST",
headers: {
"Content-Type": "application/json",
},
}).then((response) => {
var reader = response.body.getReader();
var bytesReceived = 0;
// read() returns a promise that resolves when a value has been received
reader.read().then(function processResult(result) {
console.log(result);
// Result objects contain two properties: //对象包含两个属性
// done - true if the stream has already given you all its data. //如果流已经为您提供了所有数据,则为true。
// value - some data. Always undefined when done is true. //一些数据。完成时始终未定义为真。
if (result.done) {
console.log("Fetch complete");
return;
}
// result.value for fetch streams is a Uint8Array
bytesReceived += result.value.length;
console.log("Received", bytesReceived, "bytes of data so far");
// Read some more, and call this function again
return reader.read().then(processResult);
});
});
},