XAML绑定UWP中的一个List <>项目

Question

我在绑定List <>中的一项时遇到问题。

我已经从JSON文件导入了数据，我想遍历其中的Array并将其显示在TextBoxes中。

数据如下所示：

{name: "ABC", Items: [ {str: "aaa"}, {str: "bbb"}, {str: "ccc"} ]}

这是C＃的示例：

public class A
{
    public string Str { get; set; }
}
public class ParentA
{
    public string Name { get; set; }
    public List<A> Items { get; set; }
}

public class MyPage : Page
{
    public ParentA ObjectParrentA { get; set; }
    public int SelectedItem { get; set; }

    public MyPage ()
    {
        ObjectParrentA = new ParentA();
        // here is binding of ObjectParrentA by JSON data.
        SelectedItem = 0;
        this.DataContext = this;
        this.InitializeComponent();
    }
    private void NextItem_Click(object sender, RoutedEventArgs e)
    {
        SelectedItem++;
    }
}

和XAML：

<TextBlock Text="{Binding ObjectParrentA.Items[SelectedItem].Str}" />
<Button Name="NextItem" Click="NextItem_Click" Content="Next Item" />

在“文本框”的开头应显示“ aaa”，单击“下一个项目”按钮后应显示“ bbb”，依此类推。

现在，TextBlock为空白。 我认为“绑定ObjectParrentA.Items [SelectedItem] .Str”一定存在问题，但是我没有太多的绑定经验。

您有什么提示，如何实现？ 谢谢。

Answer 1

我将其略微更改为更多的MVVM。 您需要将其重构为页面：

public class A
{
    public string Str { get; set; }
}

public class ParentAViewModel : INotifyPropertyChanged
{
    private int _currentIndex;

    public ParentAViewModel()
    {
        Items = new List<A>();
    }

    public string Name { get; set; }
    public List<A> Items { get; set; }

    public int CurrentIndex
    {
        get
        {
            return _currentIndex;
        }
        set
        {
            _currentIndex = value;
            OnPropertyChanged();
            OnPropertyChanged(nameof(CurrentItem));
        }
    }

    public string CurrentItem => Items[CurrentIndex].Str;

    public event PropertyChangedEventHandler PropertyChanged;

    protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}

public partial class MainWindow : Window
{
    public ParentAViewModel ObjectParrentA { get; set; }
    public int SelectedItem { get; set; }

    public MainWindow()
    {
        ObjectParrentA = new ParentAViewModel();
        ObjectParrentA.Items.Add(new A() { Str = "1" });
        ObjectParrentA.Items.Add(new A() { Str = "2" });
        ObjectParrentA.Items.Add(new A() { Str = "3" });
        // here is binding of ObjectParrentA by JSON data.
        SelectedItem = 0;
        this.DataContext = this;

        InitializeComponent();
    }

    private void NextItem_Click(object sender, RoutedEventArgs e)
    {
        ObjectParrentA.CurrentIndex++;
    }
}

XAML：

<StackPanel>
    <TextBlock Text="{Binding ObjectParrentA.CurrentItem}" />
    <Button Name="NextItem" Click="NextItem_Click" Content="Next Item" />
</StackPanel>

当您绑定到可观察的属性时，WPF可以发挥最佳作用-方法可能很棘手。 通常，添加一个ViewModel可以简化此操作，因此您不会使用仅与视图相关的对象来污染模型类。

在这里，我们正在通过绑定监视CurrentItem属性。 当单击按钮时，我们通过CurrentIndex设置器的OnPropertyChanged（nameof（CurrentItem））通知WPF CurrentItem已更改，然后将视图重新绑定到新值。

我希望这是有道理的。 祝好运。