Hands-On Full-Stack Web Development with ASP.NET Core

The category menu

You can begin to build the product listing page and implement the categories menu as depicted in this diagram by following these next steps:

1. Create the folder /src/components/market.
2. Implement the CategoryMenyItem component:
   1. Create the file /src/components/market/CategoryMenuItem.vue
   2. Write the following code:

<template>  <div class="container" @click="onSelected" :class="{selected: checked}">    <span>{{ categoryName }}</span>  </div></template> <script>export default {  name: 'CategoryMenuItem',  props: {    categoryName: String,    checked: Boolean,  },  methods: {    onSelected: function() { this.$emit('selected', this.categoryName); ...