文件内容对比

最新推荐文章于 2024-07-16 17:20:09 发布

理想和远方_在路上

最新推荐文章于 2024-07-16 17:20:09 发布

阅读量504

点赞数 7

文章标签： vue.js javascript 前端

本文链接：https://blog.csdn.net/weixin_38822843/article/details/135518694

版权

 <template>
  <div>
    <el-row :gutter="10">
      <el-col :span="12">
        <el-input :autosize="{ minRows: 30, maxRows: 50}" type="textarea" v-model="oldValue" placeholder=""></el-input>
      </el-col>
      <el-col :span="12">
        <el-input :autosize="{ minRows:30, maxRows: 50}" type="textarea" v-model="newValue" placeholder=""></el-input>
      </el-col>
    </el-row>
    <code-diff :old-string="oldValue" :new-string="newValue" diff-style="char" filename="原文件" newFilename="修改后文件" output-format="side-by-side" />
  </div>
</template>

<script>
export default {
  data() {
    return {
      oldValue: "",
      newValue: "",
      data: [
        {
          title: "Book 1",
          authors: [
            { name: "Author 1" },
            { name: "Author 2" },
            { name: "Author 3" },
            { name: "Author 4" },
            { name: "Author 5" },
            { name: "Author 5" },
            { name: "Author 5" },
            // more authors
          ],
          showMore: false,
        },
        // more data items
      ],
    };
  },
  methods: {
    toggleShowMore(index) {
      this.data[index].showMore = !this.data[index].showMore;
    },
    getAuthors(authors, showMore) {
      if (authors.length > 5 && !this.showMore) {
        return authors.slice(0, 5);
      }
      return authors;
    },
  },
};
</script>