Skip to content

Commit 3d2e5d3

Browse files
committed
Additional Update Guide changes.
1 parent e93fa48 commit 3d2e5d3

File tree

3 files changed

+109
-0
lines changed

3 files changed

+109
-0
lines changed

doc/jp/components/general-changelog-dv-react.md

+24
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,30 @@ _language: ja
1010

1111
{ProductName} の各バージョンのすべての重要な変更は、このページに記載されています。
1212

13+
## **{PackageVerChanges-24-2-APR2}**
14+
15+
> [!Note] バージョン 19.0.0 では、React 製品に多くの重大な変更が導入され、API の改善と整理が行われました。詳細は完全なアップデートガイドをご参照ください。
16+
17+
[アップデート ガイド](update-guide.md)
18+
19+
### 削除済
20+
- `CheckboxChangeEventArgs` は削除されました。代わりに `IgrCheckboxChangeEventArgs` を使用してください。
21+
- `RadioChangeEventArgs` は削除されました。代わりに `IgrRadioChangeEventArgs` を使用してください。
22+
- `IgrRangeSliderValue` は削除されました。代わりに `IgrRangeSliderValueEventArgs` を使用してください。
23+
- `IgrActiveStepChangingArgs` は削除されました。代わりに `IgrActiveStepChangingEventArgs` を使用してください。
24+
- `IgrActiveStepChangedArgs` は削除されました。代わりに `IgrActiveStepChangedEventArgs` を使用してください。
25+
26+
27+
### 機能拡張
28+
29+
#### Stepper
30+
Stepper Step の `titlePosition` は、同じ動作を持つ undefined ではなく、デフォルトで `auto` に設定されるようになりました。
31+
32+
#### Tabs
33+
`igr-tab` パネル プロパティは削除されました。
34+
35+
igr-tab-panel コンポーネントは削除されました。igr-tab では、タブ ヘッダーとタブ コンテンツの両方が 1 つのコンポーネントに含まれるようになりました。
36+
1337
## **{PackageVerChanges-24-2-APR}**
1438

1539
### 新しいコンポーネント

doc/jp/components/update-guide.md

+79
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,79 @@
1+
---
2+
title: アップデート ガイド | Ignite UI for React | インフラジスティックス
3+
_description: Ignite UI for React ライブラリの新しいバージョンに更新する方法については、この記事をご覧ください。
4+
_keywords: ignite ui for react, update, npm package, material components, アップデート, npm パッケージ, マテリアル コンポーネント
5+
_language: ja
6+
---
7+
8+
# アップデート ガイド
9+
Ignite UI for React バージョニング は、最初の数字がコードがサポートする React のメジャー バージョンで、2 番目の数字はメジャー バージョン リリースの数字です。重大な変更はメジャー リリースとメジャー リリースの間にリリースされる場合があります。Ignite UI for React 各リリースのすべての変更の一覧は、製品 [CHANGELOG](./general-changelog-dv-react.md) をご覧ください。
10+
11+
12+
## 18.9.0 から 19.0.0 の場合
13+
このリリースでは、一部の React コンポーネントの内部構造が大幅に再設計され、**igniteui-react** および **igniteui-react-grids** パッケージに以下の変更が加えられました。
14+
15+
### 一般
16+
#### 重大な変更
17+
18+
- Ignite UI for React のコンポーネントは、React の関数コンポーネントを使用するようになりました。これにより、***useRef*** で取得される参照は、クラス コンポーネントのインスタンスではなく、ネイティブ要素へのフォワード参照になります。多くのユースケースでは変更なしにそのまま使用できますが、DOM 要素自体へアクセスするために追加のプロパティが不要になるなど、一部の実装には変更が必要な場合があります。
19+
- すべてのプロパティでの代替的な文字列ユニオン タイプ (例: ***boolean | string******number | string***) の使用は、コンポーネントでサポートされなくなりました。さらに、文字列のユニオン タイプでは大文字と小文字が区別されなくなりました。
20+
21+
```tsx
22+
<IgrColumn dataType="String" sortable="true"></IgrColumn>
23+
```
24+
25+
は次のようになります:
26+
27+
```tsx
28+
<IgrColumn dataType="string" sortable={true}></IgrColumn>
29+
```
30+
- コンポーネント イベントには **on** というプレフィックスが付きます。つまり
31+
32+
```tsx
33+
<IgrGrid columnPin={handlePinning}></IgrGrid>
34+
```
35+
36+
は次のようになります:
37+
38+
```tsx
39+
<IgrGrid onColumnPin={handlePinning}></IgrGrid>
40+
```
41+
42+
- コンポーネント イベントは、最初の引数として **sender** の代わりに単一の標準 **CustomEvent** 引数を発行します。したがって、***sender.nativeElement*** などのカスタム プロパティは使用できなくなりましたが、ネイティブ イベント プロパティはすべて使用できます。また、イベント引数のタイプは特定のカスタム イベントのエイリアスとして使用できるため、***detail*** にアクセスする使用法は同じままです。新しいハンドラー シグネチャでは、***event.detail*** は同じで、***event.target*** は送信者と同等の DOM 要素になります。
43+
44+
```tsx
45+
const handlePinning = (sender: IgrGridBaseDirective, event: IgrPinColumnCancellableEventArgs) => {};
46+
```
47+
48+
は次のようになります:
49+
50+
```tsx
51+
const handlePinning = (event: IgrPinColumnCancellableEventArgs) => {}
52+
// equivalent to
53+
const handlePinning = (event: CustomEvent<IgrPinColumnCancellableEventArgsDetail>) => {}
54+
```
55+
- コンポーネントには、デフォルトで非機能的な ***name*** プロパティが付与されなくなりました。***name*** プロパティは、主に **IgrInput****IgrCombo** などのフォーム入力コンポーネントにおいてネイティブの機能を持つため、**igniteui-react** のコンポーネントにのみ残されています。
56+
- Ignite UI for React コンポーネントでは、React の[ドキュメント](https://react.dev/learn/rendering-lists#keeping-list-items-in-order-with-key)に従って必要な場合を除き、***key*** プロパティは不要になりました。
57+
- [IgrDataGrid](./grids/data-grid/overview.md) は、**igniteui-react-grids** パッケージの一部ではなくなりました。より軽量な構成を実現するため、**igniteui-react-data-grids** パッケージに移動されました。
58+
- バージョン **18.9.0** ではクラスとして公開されていたいくつかの型は、現在ではタイプとしてエクスポート されるようになりました。これらは以下のように使用できます:
59+
60+
```tsx
61+
const pivotConfiguration = new IgrPivotConfiguration();
62+
```
63+
64+
は次のようになります:
65+
66+
```tsx
67+
const pivotConfiguration: IgrPivotConfiguration = {
68+
rows: [],
69+
columns: [],
70+
values: []
71+
}
72+
```
73+
74+
- **IgrButton**
75+
- **重大な変更**
76+
- ***clicked*** イベントは削除されました。代わりにネイティブの ***onClick*** を使用してください。
77+
- **IgrInput**
78+
- **重大な変更**
79+
- ***inputOccurred*** イベントの名前が ***onInput*** に変更されました。

docfx/jp/components/toc.json

+6
Original file line numberDiff line numberDiff line change
@@ -123,6 +123,12 @@
123123
"name": "Ignite UI for React と Next.js の統合",
124124
"href": "nextjs-usage.md"
125125
},
126+
{
127+
"exclude": ["Angular", "Blazor", "WebComponents"],
128+
"name": "アップデート ガイド",
129+
"href": "update-guide.md",
130+
"status": "NEW"
131+
},
126132
{
127133
"exclude": ["Angular"],
128134
"name": "インタラクティビティ",

0 commit comments

Comments
 (0)