React photo gallery in Vue.js

Hi there !
I’m struggling with the following issue: I’m working on a search engine result page for images. It’s quite tricky to format properly the images on a simple request such as “eiffel tower” for instance (check on Google or Ecosia) because you get images formats which are very different, so to display them in a good way (size, alignment…) in addition to responsive feature, it’s a challenge.

I found the perfect library in React for that: GitHub - neptunian/react-photo-gallery: React Photo Gallery but I can’t find the same resources on vue… Have I missed something?

thanks for your help !

My English is not good, the following content has been translated by Google:

It won’t be difficult to write one by you hand.

the point is that the server needs to provide the width and height of each picture, and the rest of the problem is the layout and scaling algorithm.

For multi-line layout:
Set the basic height and maximum and minimum height of each row. Then create a row and add pictures, and scale each picture to the base height. When the total width of the pictures in a row approaches or exceeds the edge, each picture in the row is rescaled to a suitable size to fit the width of the list, and then the next row is created.

For Multi-column layout:
Multi-column layout is much simpler, you only need to specify how many columns you need,
Then loop to add next picture to the column with the smallest total height of the picture, and zoom the picture to the same width as the target column.

Thanks a lot for your answer ! I’ll try this and see how it works out !