vue截取字符串方法

// 在 Vue 中截取字符串的方法可以通过使用 JavaScript 的原生方法来实现。以下是一个简单的示例代码，展示了如何在 Vue 组件中截取字符串。

<template>
  <div>
    <p>{{ truncatedText }}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      originalText: "这是一个非常长的字符串，需要进行截取处理。",
      maxLength: 10 // 设置最大长度
    };
  },
  computed: {
    truncatedText() {
      // 使用 substring 方法截取字符串
      if (this.originalText.length > this.maxLength) {
        return this.originalText.substring(0, this.maxLength) + "..."; // 如果超过最大长度，添加省略号
      }
      return this.originalText; // 如果没有超过最大长度，返回原始字符串
    }
  }
};
</script>

<!-- 解释说明：
1. `originalText` 是我们要截取的原始字符串。
2. `maxLength` 是我们希望截取的最大长度。
3. `truncatedText` 是一个计算属性，它会根据 `originalText` 和 `maxLength` 来决定是否需要截取字符串。
4. 使用了 JavaScript 的 `substring` 方法来截取字符串，并在超过最大长度时添加省略号。
5. 最终在模板中通过插值表达式 `{{ truncatedText }}` 显示截取后的字符串。
-->