How to pass data using props?

Hi,
I’m not sure if this can be done with props or in some other way but let me explain what I’m trying to accomplish.
I’m trying to pass data from one component, to a component located inside another component. I’ve created two variables, profileText and profileURL.
EmployerSidebarNav.vue:

<ul class="nav flex-column sub-menu">
    <li class="nav-item"><router-link class="nav-link" :to="profileURL">{{ profileText }}</router-link></li>
</ul>

After an Employer fills out a Profile, I want to load the Employer’s Profile and run an if statement.

if(!this.employerProfiles) {
    let profileText = 'Create Profile';
} else {
    let profileText = 'View Profile';
}

Basically if the profile exists create a variable with this text:

let profileText = 'Create Profile';

else this text:

let profileText = 'View Profile';

Now, I want to send this variable profileText and the appropriate value, down to my EmployerSidebarNav.vue component.

P.S. I want to do the same thing with profileURL.

My <EmployerSidebarNav /> component is located in my AppSidebar.vue component.

<div v-else-if="$store.state.profile.role === 'employer'">
  <EmployerSidebarNav />
</div>

Here is the full createEmployerProfile function and the loadEmployerProfile function.
ProfileCreate.vue:

loadEmployerProfile: async function() {
    try {
        const response = await employerProfileService.loadEmployerProfile();
        this.employerProfiles = response.data.employerProfiles

    } catch (error) {
        this.$toast.error("Some error occurred, please refresh!");
    }
},

createEmployerProfile: async function() {

    let formData = new FormData();
    formData.append('company_name', this.employerProfileData.company_name);
    formData.append('phone', this.employerProfileData.phone);
    formData.append('number_of_employees', this.employerProfileData.number_of_employees);
    formData.append('street', this.employerProfileData.street);
    formData.append('city', this.employerProfileData.city);
    formData.append('country', this.employerProfileData.country);
    formData.append('zip_postal', this.employerProfileData.zip_postal);
    formData.append('province_state', this.employerProfileData.province_state);
    formData.append('latitude', this.employerProfileData.latitude);
    formData.append('longitude', this.employerProfileData.longitude);

    try {
        const response = await employerProfileService.createProfile(formData);

        this.loadEmployerProfile();
        if(!this.employerProfiles) {
            let profileText = 'Create Profile';
        } else {
            let profileText = 'View Profile';
        }
        this.$router.push('/employer/profile');
        this.$toast.success("Profile created Successfully!");

    } catch (error) {
        switch (error.response.status) {
            case 422:
                this.errors = error.response.data.errors;
                break;
            default:
                this.$toast.error("Some error occurred, please try again!");
                break;
        }
    }
}

How can I pass the this variablelet profileText = 'View Profile'; into my EmployerSidebarNav.vue component?

Using Vuex store might be the way to go to simplify things.