livewire-docs/traits.blade.php at 2.x · laravel-taiwan/livewire-docs · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
* [簡介](#introduction)

## 簡介 {#introduction}

PHP Traits 是在多個 Livewire 元件之間重複使用功能的絕佳方式。

例如，您可能在應用程式中有多個 "資料表" 元件，它們都共享相同的排序邏輯。

與在每個元件中重複以下排序樣板不同：

@component('components.code-component')
@slot('class')
@verbatim
class ShowPosts extends Component
{
    public $sortBy = '';
    public $sortDirection = 'asc';

    public function sortBy($field)
    {
        $this->sortDirection = $this->sortBy === $field
            ? $this->reverseSort()
            : 'asc';

        $this->sortBy = $field;
    }

    public function reverseSort()
    {
        return $this->sortDirection === 'asc'
            ? 'desc'
            : 'asc';
    }

    ...
}
@endverbatim
@endslot
@endcomponent

您可以將此行為提取到一個可重複使用的 trait 中，名為 `WithSorting`：

@component('components.code-component')
@slot('class')
@verbatim
class ShowPosts extends Component
{
    use WithSorting;

    ...
}
@endverbatim
@endslot
@endcomponent

@component('components.code-component')
@slot('class')
@verbatim
trait WithSorting
{
    public $sortBy = '';
    public $sortDirection = 'asc';

    public function sortBy($field)
    {
        $this->sortDirection = $this->sortBy === $field
            ? $this->reverseSort()
            : 'asc';

        $this->sortBy = $field;
    }

    public function reverseSort()
    {
        return $this->sortDirection === 'asc'
            ? 'desc'
            : 'asc';
    }
}
@endverbatim
@endslot
@endcomponent

此外，如果您想在 trait 內部使用 Livewire 的生命週期鉤子，但仍然能夠在元件內部使用它們，Livewire 提供了一種語法，允許您這樣做：

@component('components.code-component')
@slot('class')
@verbatim
trait WithSorting
{
    ...

    public function bootWithSorting()
    {
        //
    }

    public function bootedWithSorting()
    {
        //
    }

```php
public function mountWithSorting()
{
    //
}

public function updatingWithSorting($name, $value)
{
    //
}

public function updatedWithSorting($name, $value)
{
    //
}

public function hydrateWithSorting()
{
    //
}

public function dehydrateWithSorting()
{
    //
}

public function renderingWithSorting()
{
    //
}

public function renderedWithSorting($view)
{
    //
}
}
```

Livewire 提供了用於查詢字串的鉤子。

```php
trait WithSorting
{
    ...

    protected $queryStringWithSorting = [
        'sortBy' => ['except' => 'id'],
        'sortDirection' => ['except' => 'asc'],
    ];

    // or as a method

    public function queryStringWithSorting()
    {
        return [
            'sortBy' => ['except' => 'id'],
            'sortDirection' => ['except' => $this->defaultSortDirection()],
        ];
    }
}
```

請注意，您可以在組件類中覆蓋任何查詢字串。
```