js读取文件并展示内容（FileReader）

文件形式：txt

实现：

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60

<template>     <div class="hello">         <h1>This is a show file page</h1>         <h3>导入文件：<input type="file" name="file" @change="showFile($event)" /> </h3><br>         <textarea v-model="input_text" name="" cols="100" rows="20" placeholder="输入……"></textarea><br><br>     </div> </template>   <script>     export default {         name: "Hello",         data: function() {             return {                 input_text: ''             }         },         methods: {               showFile(input) {                 //支持chrome IE10                 if (window.FileReader) {                     var file = input.target.files[0];                     var reader = new FileReader();                     reader.onload=((event)=>{                         this.input_text=event.target.result; // 文件的内容                         console.log(String(event.target.result))                         let temp = JSON.stringify(event.target.result).split('\\r\\n')                         temp[0] = temp[0].substr(1)                         let lastIndex = temp.length-1                         temp[lastIndex] = temp[lastIndex].substr(0,temp[lastIndex].length-1)                       })                     reader.readAsText(file);                 }                 else {                     alert("FileReader Not supported by your browser!");                 }             }         }     } </script>     <!-- Add "scoped" attribute to limit CSS to this component only --> <style scoped>     h3 {         margin: 40px 0 0;     }     ul {         list-style-type: none;         padding: 0;     }     li {         display: inline-block;         margin: 0 10px;     }     a {         color: #42b983;     } </style>