How to format a 'Create Account' form so that LastPass saves the correct details

Question

I have a React app integrated with a node.js server that has an 'invite user' flow -- a current user of the app can invite whichever email address they like, and my system will send that email address an Invite Email that will link them to a screen that has the following form in it:

<form onSubmit={this.handleSubmit}>
    <p>
        <label htmlFor="">email</label><br/>
        <input type="email" className="inpt" ref={this.input_email} value={this.state.emailText} readOnly={true}/>
    </p>

    <p>
        <label htmlFor="">name</label><br/>
        <input type="text" className="inpt" ref={this.input_name}/>
    </p>

    <p>
        <label htmlFor="">password</label><br/>
        <input type="password" className="inpt" ref={this.input_password}/>
    </p>

    <p>
        <label htmlFor="">confirm password</label><br/>
        <input type="password" className="inpt" ref={this.input_confirm_password}/>
    </p>

    <div className="btns">
        <button className="btn blue" onClick={this.acceptInvite}>create</button>
    </div>
</form>

Functionally, this form works fine -- the user fills in the form and submits it and the account is created.

The problem is that LastPass is trying to save the name rather than the email, which makes me think something in my form is not following correct standards or can in some way be improved. My login process after creating an account is email-based, not username-based. Is there something I can put in my form, in my email input, that hints to LastPass, "save this as the username"?