Vue filters用法（数据过滤、数据格式化）

 示例： 

 

 当待展示的文本信息过长时，我们需要对数据进行格式化过滤。

 

---

filters用法：

1、在script中filters下添加一个自定义的处理函数

 2、在数据变量处，进行数据过滤

 代码段附录：

<template>

    <div >
            <div class="PosContent">
                {{content | contentFormat}}
            </div>

            <div class="PosButton">
                详情
            </div>
    </div>

</template>

<script>
export default {
  name: 'Empty',
  props: {
    // soft: String,
    data2: {},
  },
  data () {
    return {
      visible: true,
      content: 'easyIcon是一款简单易用的Icon制作工具，助您快速制作所需Icon (操作简便，拖拽进入，一键导出)。软件下载 http://scimence.cn/soft/easyicon/easyIcon.exe easyIcon是一款简单易用的Icon制作工具，助您快速制作所需Icon (操作简便，拖拽进入，一键导出)',
    }
  },

  filters: {
    
    contentFormat(content)
    {
        if(content.length > 56)
        {
            return content.substring(0, 56) + '...';
        }
        else return content;
    }
  },

  mounted() {
  },
  created() {
  },

  methods: {
  }

}
</script>

<style scoped>
</style>