FletでReactチュートリアルを真似る2

こちらの続きです。
FletでReactチュートリアルを真似る1 - C#ATIA
やっぱりprops,stateが無いので、無理が有る・・・。

こちらを進めました。
チュートリアル：React の導入 – React

BoardクラスのrenderSquareメソッドを修正します。

class Board(ft.UserControl):
    def renderSquare(self, i):
        return Square(i) 
・・・

続いて、Squareクラスを修正です。

class Square(ft.UserControl):
    def __init__(self, value):
        super().__init__()
        self.value = value

    def build(self):
        return ft.ElevatedButton(
            f'{self.value}',
            width = 30,
            height = 30,
            bgcolor = ft.colors.BLUE_100,
            style = ft.ButtonStyle(
                shape=ft.RoundedRectangleBorder(radius=0),
                padding = 1,
            ),
        )

表示が汚かったので、paddingを入れています。(中央表示が分からない・・・)

結果はこちら。