Vue

npm install face-age

<script setup>
import { onMounted } from 'vue';
import FaceAge from 'face-age';

onMounted(() => {
  const faceAge = new FaceAge({
    elementId: 'FaceAge-module',
    faceageId: '<Your Client ID>',
    showProducts: true,
    showRoutine: true,
  });

  faceAge.render();

  faceAge.onAddToCart((data) => {
    console.log('Add to cart:', data);
  });
});
</script>

<template>
  <div id="FaceAge-module"></div>
</template>

import VueFaceAge from 'vue-face-age';

export default {
  components: {
    faceage: VueFaceAge,
  },
  data() {
    return {
      faceAgeOptions: {
        faceageId: '<Face Age Client Id>',
        type: 'skincare-analyzer',
      },
    };
  },
  methods: {
    onLoad(result) {
      console.log(result);
    },
  },
};

<template>
  <div class="demo">
    <faceage :options="faceAgeOptions" :onLoad="onLoad"></faceage>
  </div>
</template>