In this part, we will create the <script> section of the single file component. Follow these instructions to create the component correctly:
- Move the list.vue file from components to the views folder, and rename it List.vue.
- Remove the old changeComponent mixin import and import the new changeRoute mixin:
import changeRouteMixin from '@/mixin/changeRoute';
- At the Vue mixins property, we need to replace changeComponent with changeRoute:
mixins: [changeRouteMixin],
- In the getAllUsers and deleteUser methods, we need to remove ${window.location.href} from the getHttp and deleteHttp function parameters:
methods: {
async getAllUsers() {
const { data } = await getHttp(`api/users`);
this.userList = data;
},
async deleteUser(id) {
await deleteHttp(`api/users/${id}`);
await this.getAllUsers();
},
}