WPF中如何点击ComboBoxItem内按钮选中该项并执行删除？

Hey there! As a fellow WPF learner, I totally get where you're stuck here. Let's break down the problem and fix it step by step.

Why the Current Code Isn't Working #

Right now, your delete command relies on the SelectedValue property to remove an item—but when you click the Delete button inside a ComboBoxItem, WPF doesn't automatically set that item as the selected value. Plus, your ComboBox isn't even bound to the SelectedValue property in your ViewModel, so the ViewModel never gets updated with the selected item unless you manually click the item first. On top of that, your SelectedValue property's setter doesn't trigger PropertyChanged, which would keep the UI and ViewModel out of sync even if you did bind it.

Solution 1: Delete Directly Using the Command Parameter (Recommended) #

This is the cleaner approach—since your button already passes the current SavedCustomValue as a CommandParameter, we can use that object directly to delete, no need to rely on the selected state at all.

Step 1: Update the ViewModel's Command and Delete Logic #

Modify your ViewModel to accept the command parameter and use it to delete the item:

class ViewModel: INotifyPropertyChanged {
    private ObservableCollection<SavedCustomValue> _loadCustomValue;
    private SavedCustomValue _selectedValue;
    public event PropertyChangedEventHandler PropertyChanged;

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

    // Fix the SelectedValue setter to trigger PropertyChanged (good practice)
    public SavedCustomValue SelectedValue {
        get { return _selectedValue; }
        set { 
            _selectedValue = value; 
            OnPropertyChanged(); // Add this line to sync UI and ViewModel
        }
    }

    public ObservableCollection<SavedCustomValue> LoadCustomValue {
        get { return _loadCustomValue; }
        set { _loadCustomValue = value; OnPropertyChanged(); }
    }

    public ViewModel() {
        _loadCustomValue = new ObservableCollection<SavedCustomValue>(){
            new SavedCustomValue(){ CustomValueName="Custom Value 1" },
            new SavedCustomValue(){ CustomValueName="Custom Value 2" },
            new SavedCustomValue(){ CustomValueName="Custom Value 3" }
        };
    }

    // Update the Command to pass the parameter to the delete method
    private ICommand _command;
    public ICommand Command {
        get { return _command ?? (_command = new RelayCommand(DeleteItem)); }
    }

    // New DeleteItem method that uses the passed parameter
    private void DeleteItem(object parameter) {
        // Validate the parameter is a valid SavedCustomValue
        if (parameter is SavedCustomValue itemToDelete) {
            LoadCustomValue.Remove(itemToDelete);
            MessageBox.Show($"Remaining items: {LoadCustomValue.Count}");
        }
    }

    public class SavedCustomValue {
        public string CustomValueName { get; set; }
    }
}

Step 2: Add SelectedValue Binding to ComboBox (Optional but Good Practice) #

Even though we're not relying on it for deletion, binding the ComboBox's selected value to your ViewModel keeps the UI and ViewModel state consistent. Update your XAML:

<ComboBox HorizontalAlignment="Center" VerticalAlignment="Center" Width="149"
          ItemsSource="{Binding LoadCustomValue}"
          SelectedValue="{Binding SelectedValue}"> <!-- Add this line -->
    <ComboBox.ItemTemplate>
        <DataTemplate>
            <StackPanel Orientation="Horizontal">
                <TextBlock Text="{Binding CustomValueName}"/>
                <Button Command="{Binding ElementName=root, Path=DataContext.Command}" 
                        CommandParameter="{Binding}" 
                        Content="Delete" />
            </StackPanel>
        </DataTemplate>
    </ComboBox.ItemTemplate>
</ComboBox>

Solution 2: Auto-Select the Item Before Deleting #

If you specifically want visual feedback (the item highlights before being removed), modify the DeleteItem method to set the SelectedValue first:

private void DeleteItem(object parameter) {
    if (parameter is SavedCustomValue itemToDelete) {
        // Set the item as selected to give visual feedback
        SelectedValue = itemToDelete;
        // Now delete the selected item
        LoadCustomValue.Remove(itemToDelete);
        MessageBox.Show($"Remaining items: {LoadCustomValue.Count}");
    }
}

Key Takeaways for WPF Newbies #

• CommandParameter is your friend: It lets you pass context (like the current item) directly to your command, so you don't have to rely on UI state like selected values.
• Always trigger PropertyChanged: When updating ViewModel properties that bind to the UI, call OnPropertyChanged() to keep the UI and ViewModel in sync.
• Bind UI elements to ViewModel properties: For controls like ComboBox, binding SelectedValue or SelectedItem ensures you always have access to the user's selection.

内容的提问来源于stack exchange，提问作者Junaid Shaikh