Escribí este código para una pantalla de cuadrícula ajustable, funciona perfectamente bien, pero el único problema que tengo es que quiero que el mínimo y la mezcla sean 16 x 100. Entonces, cuando se hace clic en un botón, aparece una ventana emergente y pregunta para el tamaño de la cuadrícula, puede poner solo entre 16-100, pero cuando pongo 120, todavía funciona, sin embargo, no quiero que sea así, ¿cómo puedo cambiarlo para que funcione como se indica?
const sketchpad = (props) => { const sketchSize = Math.min(props.portSize.width, props.portSize.height - 50); const cellSize = Math.round(sketchSize / props.size); const divSize = Math.max(sketchSize, cellSize * props.size); const grid = props.pixelData.map((pixel, idx) => ( <Cell cellSize={cellSize} sketchSize={sketchSize} bgColour={pixel} keys={idx} key={idx} onMouseDown={props.mouseDown} setColor={props.setColor} /> )); return ( <div className={`d-flex justify-content-center ${classes.SketchContainer}`}> <div className={`my-3 ${classes.Sketchpad}`} style={{ height: `${divSize}px`, width: `${divSize}px` }} onMouseUp={props.mouseUp} > {grid} </div> </div> ); };y mi mensaje
const gridSize = prompt("Please enter grid size"); if (gridSize < 100 && gridSize > 16) { setGridSize(gridSize); newPixelData = initPixelData(gridSize, INIT_BG_COLOUR); } else { alert("choose between 16-100") const gridSize = prompt("Please enter your number"); setGridSize(gridSize); newPixelData = initPixelData(gridSize, INIT_BG_COLOUR); }Aquí hay un ejemplo usando while que ejecutará el bucle hasta que se ingrese un valor que cumpla con todas las condiciones. (Agregué una verificación isNaN , ya que también querrá confirmar que el valor devuelto es incluso un número).
let gridSize = prompt('Please enter grid size'); // if gridSize isn't a number OR is greater than 100 OR is less than 16, run the loop again while (isNaN(gridSize) || gridSize > 100 || gridSize < 16) { alert('choose between 16-100'); gridSize = prompt('Please enter your number'); } console.log(gridSize); // setGridSize(gridSize); // newPixelData = initPixelData(gridSize, INIT_BG_COLOUR);