我试图从Braintree渲染hostedFields。发生的事情是我创建了一个密钥并获得了我的令牌，我也传递了我的函数来创建hostedFields，但然后我得到了一个错误client.getVersion is not a function。我确信我传递的客户端令牌是正确的，我知道SDK版本匹配。
我还遗漏了什么导致这个错误和字段不匹配？你能从下面的代码中注意到什么吗？

import { client, hostedFields } from 'braintree-web';
import styles from '../../styles/Booking.module.css';

export default function PaymentForm() {

    const createClient = async () => {
        try {
            const res = await client.create({
                authorization: '<MY_SANDBOX_KEY>'
             });
             const clientToken = res._configuration.authorization;
             clientDidCreate(clientToken)
        } catch (err) {
            console.error(err);
        }

    }

    const clientDidCreate = (client) => {
       console.log(client);
        hostedFields.create({
            client: client,
            styles: {
                'input': {
                    'font-size': '16pt',
                    'color': '#3A3A3A'
                  },
                  '.number': {
                    'font-family': 'monospace'
                  },
                  '.valid': {
                    'color': 'green'
                  }
            },
            fields: {
                number: {
                    container: '#card-number'
                },
                cvv: {
                    container: '#cvv',
                    placeholder: '***'
                },
                expirationDate: {
                    container: '#expiration-date'
                }
            }
        }) 

        console.log(res);
    }

    useEffect(() => {   
     createClient()
    }, []);
  
    return (
            <form>
                <label htmlFor="card-number">Card Number</label>
                <div id="card-number"></div>
                <label htmlFor="cvv">CVV</label>
                <div id="cvv"></div>
                <label htmlFor="expiration-date">Expiration Date</label>
                <div id="expiration-date"></div>
                <p>By submitting this order, I agree to the <a href="#">Treatment Program Terms</a> and <a href="#"> Privacy Notice.</a></p>
                <button  type="button">Submit </button>
            </form>
       
    )
}```