I want to call a model after I click the pay button, I get this error

type 'Null' is not a subtype of type 'PaymentViewModel' of 'function result".

Check my code below and please correct me where I am getting it wrong.

This is my Payment Form Page

class PayfastPayment extends StatefulWidget {
  PayfastPayment({Key? key}) : super(key: key);

  @override
  _PayfastPaymentState createState() => _PayfastPaymentState();
}

class _PayfastPaymentState extends State<PayfastPayment> {
  TextEditingController amountController = TextEditingController();
  TextEditingController itemNameController = TextEditingController();
  late PaymentViewModel model;
  var client = http.Client();
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(centerTitle: true, title: const Text("Payment Page")),
      body: Column(
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [
          TextFormField(
            controller: amountController,
            decoration: const InputDecoration(
              border: UnderlineInputBorder(),
              labelText: 'Amount',
            ),
          ),
          const SizedBox(
            height: 100,
          ),
          TextFormField(
            controller: itemNameController,
            decoration: const InputDecoration(
              border: UnderlineInputBorder(),
              labelText: 'Item Name',
            ),
          ),
          SizedBox(
            width: 220,
            height: 100,
            child: InkWell(
              onTap: () {
                print(
                    "Amount: ${amountController.text} Item: ${itemNameController.text}");
                model.payment(amountController.text, itemNameController.text);
              },
              child: Container(
                alignment: Alignment.center,
                color: Colors.blue,
                child: const Center(
                    child: Text("Pay",
                        style: TextStyle(fontSize: 22, color: Colors.white))),
              ),
            ),
          ),
        ],
      ),
    );
  }
}

The error is on this line inside onTap method: model.payment(amountController.text, itemNameController.text);

This is my view model page I want to call

class PaymentViewModel {
  final TextEditingController amountController = TextEditingController();
  final TextEditingController itemNameController = TextEditingController();
  late API api;
  String? errorMessage;
  late String payFast;

  void payment(String amount, String item_name) {
    String? paymentErrorMessage = null;
    if (paymentErrorMessage != null) {
      errorMessage = paymentErrorMessage;
    } else {
      amount = amountController.text;
      item_name = itemNameController.text;
      api
          .payFastPayment(amount: amount, item_name: item_name)
          .then((createdPayment) {
        if (createdPayment == null) {
          errorMessage = "Something went wrong. Please try again.";
        } else {
          payFast = createdPayment;
        }
        print("It reaches here");
      }).catchError((error) {
        errorMessage = '${error.toString()}';
      });
    }
  }
}

CodePudding user response：

You are assigning it before condition check in paymentModel and assigning it to a string error message String? paymentErrorMessage = null; Remove this line Also remove this line amount = amountController.text;. Your method should be like this

void payment(String amount, String item_name) {
    
      
      item_name = itemNameController.text;
      api
          .payFastPayment(amount: amount, item_name: item_name)
          .then((createdPayment) {
        if (createdPayment == null) {
          errorMessage = "Something went wrong. Please try again.";
        } else {
          payFast = createdPayment;
        }
        print("It reaches here");
      }).catchError((error) 
        errorMessage = '${error.toString()}';
      });
    
  }