滚动后重复使用单元格后如何在表格视图单元格中保持值？

Question

here is the .gif of my problem: http://g.recordit.co/LnslGAaWwK.gif

at first, I can use increment or decrement button to increase or decrease the value. but after scrolling the table view to bottom and then back to the stepper I changed before, then it seems the decrement button doesn't work, the value from the counter label still remain the same

but, if I tap the increment button , it works, but still giving the wrong value, it will start again from 1, it doesn't continue the value before scrolling.

I suspect the problem is in here (the complete code is below):

    override func awakeFromNib() {
        super.awakeFromNib()
        setStepper()
    }

it seems after scrolling to the bottom of table view, it seems the setStepper() in awakeFromNib() will be triggered again and it means the initial value from stepper (stepper.value = 0) , Will be back again to zero, thats maybe why If I press the increment button, it will give 1, not continuing the value before scrolling

here is the code from my table view cell

import UIKit
import KWStepper

protocol CounterDelegate{
    func incrementOrDecrementButtonDidTapped(at selectedIndexPath:IndexPath, counterValue: Int)
}

class CheckOutCell: UITableViewCell {

    var stepper: KWStepper?
    var indexPath: IndexPath?
    var delegate: CounterDelegate?

    @IBOutlet weak var counterLabel: UILabel!
    @IBOutlet weak var decrementButton: UIButton!
    @IBOutlet weak var incrementButton: UIButton!

    var productData : Product? {
        didSet {
            updateUI()
        }
    }

    override func awakeFromNib() {
        super.awakeFromNib()
        setStepper()
    }


    func setStepper() {

        stepper = KWStepper(decrementButton: decrementButton, incrementButton: incrementButton)
        guard let stepper = stepper else {return}

        stepper.autoRepeat = false
        stepper.wraps = false
        stepper.minimumValue = 0
        stepper.value = 0
        stepper.incrementStepValue = 1
        stepper.decrementStepValue = 1

        stepper.valueChangedCallback = { stepper in
            let stepperValue = Int(stepper.value)

            // send data to CheckoutVC
           guard let indexPath = self.indexPath else {return}
           self.delegate?.incrementOrDecrementButtonDidTapped(at: indexPath, counterValue: stepperValue)

            print(stepperValue)

        }
    }



    func updateUI() {

        guard let productData = productData else {return}
        counterLabel.text = "\(productData.quantity)"


    }


}

so how to solve this problem ? how to make the value continue after I scroll the table view to the bottom ?

Answer 1

You need to rethink your strategy.

A TableView is only the visual representation of the data in its datasource and only a part of the datasource is visible at a time.

So the data which is displayed by a TableViewCell should be stored in the datasource, not in the cell.

Organize your data in an Array and let the TableViews datasource point to that array. You need to implement the methods of the UITableViewDatasource protocol ( numberOfSections , numberOfRowsInSection ).

Then, override cellForRowAtIndexPath where the cell is set up with the data coming from the datasource array at the index of indexPath.row .

The changes made with your stepper should then be made within the datasource.

Hope you get the idea.