（如何）我應該在 Vue.js 組件（TypeScript）中使用訪問修飾符（公共、私有等）嗎？

Question

我有一個帶有 TypeScript v.4.3 的 Vue.js v2.6 項目“在后台”。
我的問題：如果在Vue 組件中使用access modifiers以及如何正確使用它們有意義，我找不到任何可以清除的文檔。
我搜索了文章、 Vue.js 文檔和 StackOverflow，沒有任何發現。 （Vue.js 文檔完全忽略了它們的存在！）

這就是我目前在 Vue 組件中使用訪問修飾符的方式：

myComponent.vue 的模板部分：

<template>
  <div>
    <!-- accessing some of the fields of the class here e.g. the getter -->
  </div>
</template>

myComponent.vue 的腳本部分：

<script lang="ts">
  import { Vue, Component, Prop, Emit } from "vue-property-decorator";

  @Component()
  export default class MyComponent extends Vue {
    @Prop() public readonly myPropertyVariable!: boolean;

    public myVariable!: string; // accessed in template

    private myInternalVariable!: boolean; // not accessed in template

    public get myGetterVariable(): string {
       // obviously accessed in template (getter)
    }

    @Emit()
    public change(): void {}

    @Action
    public doAction(): void {}

    public mounted(): void {}

    public myMethod(): boolean {
      // accessed in template
    }

    private myInternalMethod(): boolean {
      // not accessed in template
    }
  }
</script>

我希望，這不是一個基於意見的問題。 我假設有一個事實可以證實 Vue 組件中訪問修飾符的意義。 我有一種強烈的、可能是非理性的抵抗力來忽略它們。

順便說一句：我在 Rider 中編碼，訪問修飾符可能對 IDE 代碼分析有用。

Answer 1

如果它像 Angular 一樣工作，您在代碼中注釋的公共修飾符將確保您的模板可以調用這些公共函數。

也許正如其他開發人員所說，在@refs 的用例中。 （雖然如果你需要它們，你很有可能是意大利面條編碼）

將方法標記為私有只是說“這不屬於模板”的一種方式。

在這些類是強制的“前端場景”中，訪問器的使用只會增加可讀性（和混亂：D）

這個問題在其他線程中沒有得到回答，主要是因為它是常識和風格，而我的 2 美分是，當您不想針對模板時使用 private ，只是為了增加代碼的可讀性。

作為旁注，我已經使用 vue 和 typescript 3 年了，我可以告訴你的一件事是，我總是發現 vue 類組件過時軟件，尤其是在 vue3 中。 Vue2 和 3 支持出色的打字稿，無需任何類組件。

Answer 2

我在我的項目中發現公共/私有訪問修飾符僅在您的組件被其他組件引用時才有用（例如，使用@Ref屬性裝飾器）

Answer 3

TypeScript 的public / private訪問修飾符不會影響轉譯的輸出，因此在 Vue 的生態系統中沒有影響。 您仍然可以使用它們，但它們只會在開發過程中通過提供屬性訪問錯誤來提供幫助。

請參閱：對 Vue.js 的 TypeScript 支持

此擴展特定於 VSCode，但似乎與您正在尋找的內容一致： https ://github.com/prograhammer/vscode-tslint-vue

Answer 4

當您想要對可以訪問的內容和不能訪問的內容進行邏輯分離時，可以使用公共/私有修飾符。 例如，在面向對象編程中，我們將對象的屬性聲明為私有，因為您永遠不會直接訪問這些屬性。 相反，您執行一個操作來修改或訪問這些屬性。 這只是一個舊的編程范式。

我給我的學生舉的例子是考慮一個現實世界的物體。 以鉛筆為例。 我們定義它的屬性並說好吧，鉛筆有長度、銳度和顏色。

這些屬性中的每一個，長度、銳度和顏色，都將以修飾符private開頭，因為我們永遠無法神奇地更改這些屬性。 如果我們將它們設為公共屬性，我們可以這樣做：

pencil.color = "blue";

突然我們的鉛筆是藍色的。 但我們不知道我們是如何來到這里的，也不知道為什么。 這是自發的鉛筆顏色變化。 我們忽略了達到這一點所需的過程或功能或方法。

因此，在一個非常基本的層面上，我們獲取或設置鉛筆的顏色。 這是另一個古老的面向對象范例，閱讀：getter 和 setter（這是一個完全不同的討論）。 然后這些函數將被聲明為公共的，因為它們代表了對象可以執行或已經執行的操作。 這樣，如果您想在代碼中的其他位置將所有鉛筆都塗成藍色，您可以這樣做：

List<Pencil> my_pencils = pencilFairy.producePencils();
    for(Pencil p : my_pencils){
        p.paint("Blue");    
    }

這樣，對於我們的鉛筆（我們從pencilFairy 最近的產品中獲得）中的每支鉛筆，我們將其稱為p，我們希望將鉛筆塗成藍色。 在 Pencil 類中，定義如何繪制鉛筆所需的邏輯將被定義。

TLDR； 您使用 private 來定義某些東西的屬性，因為該對象之外的東西不應該能夠神秘地和神奇地修改這些屬性，並且您使用 public 來定義可以在該對象上/由/對該對象執行的函數或方法，以及這些操作可以修改這些屬性或根據這些屬性返回一些其他信息等。

編輯：重讀這個問題，我相信你已經知道了大部分。 只是提供我對如何決定何時何地應該公開/私有的熱門看法。