vue的下划线是什么意思 • Worktile社区

不及物动词

这个人很懒，什么都没有留下～

vue中的下划线通常用来表示私有属性或方法。在vue中，私有属性和方法是以下划线开头的，这意味着它们只能在组件内部访问，而不能在组件外部或其他组件中访问。

使用下划线来标识私有属性或方法的原因有几个。首先，这种约定可以使代码更具可读性。当我们在阅读代码时，通过下划线可以清楚地知道某个属性或方法是私有的，不需要深入研究组件的逻辑。其次，通过将私有属性和方法标记为下划线，可以防止其他开发人员在不了解组件内部逻辑的情况下修改或访问它们，从而提高代码的安全性和稳定性。

需要注意的是，虽然使用下划线可以使属性或方法在语义上被视为私有的，但实际上它们并不真正隐藏起来。在JavaScript中，仍然可以通过直接访问属性或方法来获取或修改它们。因此，开发人员在编写代码时仍需谨慎对待私有属性和方法的访问。

2年前 0条评论

fiy

Worktile&PingCode市场小伙伴

Vue的下划线通常指的是Vue中的"_"符号，它有以下几个常见的含义和用途：

Vue组件中的data属性中下划线的使用：在Vue组件的data属性中，使用下划线作为前缀可以表示该属性是一个私有属性。这种命名约定是为了区分私有属性和公共属性，以避免属性之间的冲突。

例如：

data() {
  return {
    _privateData: '私有数据',
    publicData: '公共数据'
  }
}

Vue中的实例属性和方法名称的下划线使用：在Vue实例中，使用下划线作为前缀可以表示该属性或方法是一个私有的实例属性或方法。这种命名约定也是为了区分公共属性和私有属性，以避免冲突。

例如：

new Vue({
  data() {
    return {
      _privateData: '私有数据',
      publicData: '公共数据'
    }
  },
  methods: {
    _privateMethod() {
      // 私有方法
    },
    publicMethod() {
      // 公共方法
    }
  }
})

Vue组件的钩子函数中的下划线使用：在Vue组件的钩子函数中，使用下划线作为前缀可以表示该钩子函数是一个私有的函数，不会被外部直接调用。

例如：

export default {
  created() {
    this._privateFunction();
  },
  methods: {
    _privateFunction() {
      // 私有函数
    }
  }
}

Vue中的计算属性中的下划线使用：在Vue的计算属性中，使用下划线作为前缀可以表示该计算属性是一个私有的计算属性，只会在内部使用。

例如：

computed: {
  _privateComputed() {
    // 私有计算属性
    return this.privateData + '计算结果';
  },
  publicComputed() {
    // 公共计算属性
    return this.publicData + '计算结果';
  }
}

Vue中的过滤器中的下划线使用：在Vue的过滤器中，使用下划线作为前缀可以表示该过滤器是一个私有的过滤器，只会在内部使用。

例如：

filters: {
  _privateFilter(value) {
    // 私有过滤器
    return value + '过滤结果';
  },
  publicFilter(value) {
    // 公共过滤器
    return value + '过滤结果';
  }
}

需要注意的是，以上的下划线命名约定是一种常见的规范，但并不是Vue官方强制要求的。开发者可以根据自己的实际情况和团队约定来确定是否使用下划线以及命名的具体细节。重要的是保持一致性和清晰性。

2年前 0条评论

worktile

Worktile官方账号

在Vue中，下划线通常被用作私有属性或方法的前缀。这是一种常见的命名约定，旨在提醒开发者不要直接访问或调用这些属性或方法，因为它们是由开发者内部使用的，可能会发生变化或被移除。

下划线前缀通常用于以下场景：

私有属性：在Vue组件中，我们经常需要定义一些只在组件内部使用的属性。此时，我们可以在属性名前加上下划线，以表示这些属性是私有的，不应该从外部访问。例如：
```
export default {
  data() {
    return {
      _privateData: '私有数据',
    }
  },
  methods: {
    _privateMethod() {
      console.log('私有方法')
    },
  },
}
```
在模板中，我们可以直接使用这些私有属性和方法，但是需要注意，这些属性和方法可能会在未来的版本中被更改或删除，所以最好不要在项目的其他地方依赖这些私有属性和方法。
内部辅助方法：在Vue组件中，常常需要定义一些只在组件内部使用的辅助方法，用于处理一些逻辑，但又不希望将其暴露给组件的使用者。在这种情况下，我们也可以使用下划线前缀来表示这些方法是内部辅助方法。例如：
```
export default {
  methods: {
    _formatData(data) {
      // 内部辅助方法
      // 对传入的data进行处理
      return formattedData;
    },
    processData(data) {
      const formattedData = this._formatData(data);
      // 对处理后的数据进行操作
    }
  },
}
```
在模板中，我们只需调用processData方法，而不需要直接调用_formatData方法。

需要注意的是，虽然使用下划线前缀可以起到一定的警示作用，但并不能真正阻止外部访问和调用这些属性和方法。因此，在开发中，我们应该遵循一些更严格的规则和约定，例如使用Symbol来定义私有属性，将私有方法放在模块作用域内部等，以确保代码的安全和可维护性。

2年前 0条评论