Question

请协助：我已经使用Xamarin在一个简单的应用程序上实现了MVVM设计。我有一个Model（用户）和一个ViewModel（UserViewModel）。请注意，这个应用程序是我的第一个Xamarin / MVVM应用程序，我是新手。

我遇到的问题是添加或删除用户，视图不会更新。当我添加或删除用户时，我可以确认数据库已更新，但不是我的视图。

请参阅下面的代码，我缺少什么？

用户模型：

public class User
{
    public int Id { get; set; }
    public string Username { get; set; }
    public string FirstName { get; set; }
    public string LastName { get; set; }
    public bool IsActive { get; set; }

    public List<Role> RolesList { get; set; }
}

UserViewModel代码：

public class UsersViewModel : INotifyPropertyChanged
        {
        private UserServices UserServ { get; set; }

        public User UserSelected { get; set; }

        private ObservableCollection<User> userList;
        public ObservableCollection<User> UserList
        {
            get
            {
                return userList;
            }
            set
            {
                if (userList != value)
                {
                    userList = value;
                    NotifyPropertyChanged();
                }
            }
        }

        public event PropertyChangedEventHandler PropertyChanged;

        private void NotifyPropertyChanged([CallerMemberName] String propertyName = "")
        {
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
        }

        public UsersViewModel()
        {
            UserServ = new UserServices();
            UsersLoadAsync();
        }

        public async void UsersLoadAsync()
        {
            UserList = await UserServ.UsersGetAsync();
        }
    }

用户帮助程序服务代码（为完整性而添加）

public class UserServices
    {

        public async Task<ObservableCollection<User>> UsersGetAsync()
        {
            ObservableCollection<User> UserList = await App.UserService.GetAsync();

            return UserList;
        }

        public async Task<bool> UsersAddAsync(User user)
        {
            bool success = await App.UserService.PostAsync(user);
            return success;
        }

        public async Task<bool> UsersRemoveAsync(User user)
        {
            bool success = await App.UserService.DeleteAsync(user.Id, user);
            return success;
        }

    }

查看Xaml代码：

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:PB_Logbook"
             x:Class="PB_Logbook.MainPage"
             xmlns:ViewModels="clr-namespace:PB_Logbook.ViewModels;assembly:PB_Logbook">

    <ContentPage.BindingContext>
        <ViewModels:UsersViewModel/>
    </ContentPage.BindingContext>
    <StackLayout>
        <ListView ItemsSource="{Binding UserList, Mode=TwoWay}" HasUnevenRows="True" ItemSelected="Item_SelectedAsync" IsPullToRefreshEnabled="True">
        <ListView.ItemTemplate>
            <DataTemplate>
                <ViewCell>
                    <StackLayout Orientation="Vertical" Padding="12,6">
                        <Label Text="{Binding Username}" FontSize="24"/>
                        <Label Text="{Binding FirstName}" FontSize="18" Opacity="0.6"/>
                        <Label Text="{Binding LastName}" FontSize="18" Opacity="0.6"/>
                    </StackLayout>
                </ViewCell>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>
    <Button Text="Add" Clicked="AddButton_ClickedAsync"></Button>
        <Button Text="Remove" Clicked="RemoveButton_ClickedAsync"></Button>
    </StackLayout>


</ContentPage>

查看背后的代码：

public partial class MainPage : ContentPage
    {
        private UserServices UserServices { get; set; }
        private UsersViewModel UsersVM { get; set; }


        public MainPage()
        {
            InitializeComponent();
            UserServices = new UserServices();
            UsersVM = new UsersViewModel();
        }

        private async void AddButton_ClickedAsync(object sender, EventArgs e)
        {
            await AddUserAsync();
        }

        private async void RemoveButton_ClickedAsync(object sender, EventArgs e)
        {
            await RemoveUserAsync();
        }

        private async void Item_SelectedAsync(object sender, EventArgs e)
        {
            UsersVM.UserSelected = ((User)((ListView)sender).SelectedItem);

        }

        private async void Pull_RefreshAsync(object sender, EventArgs e)
        {
            //UsersVM.UsersLoadAsync();
        }

        private async Task AddUserAsync()
        {
            Random rnd = new Random();
            int rndNumber = rnd.Next(1, 100);

            User user = new User()
            {
                Username = "User  " + rndNumber,
                FirstName = "Firstname  " + rndNumber,
                LastName = "Surname " + rndNumber,
                IsActive = true
            };

            bool success = await UserServices.UsersAddAsync(user);

            if (success)
            {
                if (!UsersVM.UserList.Contains(user))
                    UsersVM.UserList.Add(user);
            }
        }

        private async Task RemoveUserAsync()
        {
            bool success = await UserServices.UsersRemoveAsync(UsersVM.UserSelected);

            if (success)
            {
                if (UsersVM.UserList.Contains(UsersVM.UserSelected))
                    UsersVM.UserList.Remove(UsersVM.UserSelected);
            }
        }
    }

问题在于添加/删除在我的视图中未更新的用户。

谢谢。

Answer 1

如果您是Xamarin MVVM的新手，此链接将帮助您了解Xamarin Forms中MVVM的基础知识

https://deanilvincent.github.io/2017/06/03/basic-understanding-of-mvvm-and-databinding-in-xamarin-forms/

我也建议，请减少代码背后的内容，然后实现包括ViewModel中命令在内的所有内容。

您已经写过保存和更新时代码正常工作但没有正确反映视图？您应该在保存命令后立即将方法放入列表中。

在你的xaml中就像这样

<Button Text="Save" Command="{Binding SaveCommand}"/>

在ViewModel中，您应该使用来自Xamarin的命令

public Command SaveCommand{
   get{
      return new Command(async()=>{
           // your command save here
           // then put your method for fetching the updated list: your UsersLoadAsync();
      });
   }
}

如果您是MVVM新手，也可以查看link。它使用Xamarin MVVM。完成后，您将拥有简单的天气应用程序和简单的mvvm实现

我希望它可以帮到你

MVVM INotifyPropertyChanged不起作用

1 个答案: