Cannot using tabs / Segmented control about mijin

[chandranoor]

Oh I see, I will look into code used in the documentation for other components

Thanks for your reply, it's really helpful.

[lecoueyl]

Hi @chandranoor

The code in the documentation is quite dummy and will not work if pasted directly since it needs a data to bind.
You can view the code used in the documentation:
https://github.com/lecoueyl/mijin.web/blob/main/src/pages/docs/atoms/segmentedControl.vue
https://github.com/lecoueyl/mijin.web/blob/main/src/pages/docs/atoms/tabs.vue

Or you should be able to use the component like this:

<template>
  <div>
    <MjSegmentedControl>
      <MjSegmentedControlItem
        :selected="selectedItem === 'banana'"
        @select="selectedItem = 'banana'"
      >
        Banana
      </MjSegmentedControlItem>
      <MjSegmentedControlItem
        :selected="selectedItem === 'orange'"
        @select="selectedItem = 'orange'"
      >
        Orange
      </MjSegmentedControlItem>
      <MjSegmentedControlItem
        :selected="selectedItem === 'kiwi'"
        @select="selectedItem = 'kiwi'"
      >
        Kiwi
      </MjSegmentedControlItem>
    </MjSegmentedControl>
  </div>
</template>

<script>
export default {
  data() {
    return {
      selectedItem: "banana",
    };
  },
};
</script>

Hope it helps, and thank you for your interest!

[lecoueyl]

I'm going to close this issue since no response for 14 days.
If you feel this issue should be reopened, create a new issue linking back to this one for added context. Thanks!