CODEWITHSUNDEEP
javascriptreactjsvue.jsvuejs2vue-component
splincool
splincool

Reputation: 151

Dynamic Components: React vs Vue

In React we can add dynamic component this way (I grabbed it from the react docs https://reactjs.org/docs/jsx-in-depth.html):

import React from 'react';
import { PhotoStory, VideoStory } from './stories';

const components = {
  photo: PhotoStory,
  video: VideoStory
};

function Story(props) {
  const SpecificStory = components[props.storyType];
  return <SpecificStory story={props.story} />;
}

It is just a function that returns a template with the right component (depends on props)

In Vue we can do the same logic using:

<template>    
  <component :is="currentComponent"></component>
</template>

and currentComponent will be a computed property(usually) or just a property in a data

My question is: what option is cheaper for the performance and rendering?

Upvotes: 2

Views: 2288

Answers (1)

Kathiravan Panneerselvam
Kathiravan Panneerselvam

Reputation: 11

if you want to load the component dynamically then you would go for computed property because the property value is dynamic and should be on state and i guess you are using vuex to retrive the data using ...mapGetters on computed property.

Using data property is mainly used for fixed values or declaration

Upvotes: 1

Related Questions