How to correctly write values ​​in style?

Question

Vue.js

The component has the following snippet:

<div class="pr-devs">
<template v-for="p in cd.devs">
<style>
    @media (min-width: 62em) {
        .pr-devs {
            grid-template-columns: repeat(p.grid, 1fr);
        }
    }
</style>
...
....

In styles , I inserted p.grid , which is located in the json file. I specify manually, depending on the number of content blocks.
How to correctly specify it in styles? Through style="" in html I know how to do it, but how to write it in <style>? It is not an option to write directly in styles, as it changes from the number of blocks.

Answer 1

.items {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
}

Maybe not?