0
GraphQL, Gatsby 플러그인이 예리하고 반응 : 내 쿼리에서 device.width의 자바 스크립트 계산을 포함하려고하는데 작동하지 않는 것 같습니다. 목표는 클라이언트의 장치 화면 너비를 기반으로 쿼리하여 사이트에서 반응 형 이미지를 제공 할 수 있도록하는 것입니다. 나는 deviceWidth는 int를 반환으로,이 같은 작업을 얻으려고 노력하고 responsiveSizes에 인수로 쿼리를 통과 해요 :변수가 포함 된 그래프 QL 쿼리
const deviceWidth = (window.innerWidth > 0) ? window.innerWidth : screen.width;
export const pageQuery = graphql`
query BlogPostBySlug($slug: String!) {
markdownRemark(fields: { slug: { eq: $slug } }) {
html
timeToRead
excerpt
frontmatter {
title
cover
date
category
tags
thumbnail {
childImageSharp {
responsiveSizes(maxWidth: deviceWidth, quality: 50, cropFocus: CENTER, toFormat: JPG) {
src
srcSet
sizes
base64
}
}
}
}
fields {
slug
}
}
}
`;