应用程序需要存储诸如语言、主题之类的数据,存储这些数据的最佳位置在哪里?我一直使用LocalStorage,但在我看来这不是正确的解决方案,它可以加载到数据库中,但是每次都必须从数据库中加载,那么标识信息应该存储在哪里呢?并非每次都要求用户登录。最好的使用方法是什么?
简而言之:
在 iOS 上的 webap telegram 中,在 Next.js (SPA) 上应用程序的所有页面上,应用程序自上而下滚动(甚至具有“固定bottom-0”样式的导航栏)随整个页面滚动。
在开发过程中,Android 设备或 Windows 上的浏览器中不存在此错误。
最初的目标是使应用程序无法通过滑动关闭,这是使用 Office 实现的。指南(https://docs.telegram-mini-apps.com/platform/sticky-app),但出现了这个错误。
由于我没有 iOS 设备,调试变得很复杂,我必须不断地打扰朋友和熟人来检查下一个消除错误的假设。
也许这会对您有所帮助,帮助您找到错误所在或指出我要挖掘的方向
1. Bot制作: @PuPcoinBot(自己查看bug)
2. 该错误的视频链接: https://youtube.com/shorts/S0FrakeO18U?feature =share
3.主布局.tsx:
<>
<Head>
<meta charSet="UTF-8" />
<meta
name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" // , viewport-fit=cover
/>
<meta httpEquiv="X-UA-Compatible" content="IE=edge" />
</Head>
<Script src="https://unpkg.com/@telegram-apps/[email protected]/dist/index.iife.js"></Script>
<Script id="tg">
{`(function() {
var { retrieveLaunchParams, postEvent } = window.telegramApps.sdk;
var lp = retrieveLaunchParams();
// Some versions of Telegram don't need the classes above.
if (['macos', 'tdesktop', 'weba', 'web', 'webk'].includes(lp.platform)) {
return;
}
// Expand the application.
postEvent('web_app_expand');
document.body.classList.add('mobile-body');
document.getElementById('wrap').classList.add('mobile-wrap');
document.getElementById('content').classList.add('mobile-content');
})();`}
</Script>
<Script src="https://telegram.org/js/telegram-web-app.js"></Script>
<html lang="en">
<Suspense>
<body className={inter.className}>
<div id="wrap">
<div id="content">{children}</div>
</div>
</body>
</Suspense>
</html>
</>
4.CSS样式片段:
body {
background: black;
overflow-x: hidden;
}
html,
body {
overscroll-behavior: none; /* Предотвращает перетягивание на iOS */
-webkit-overflow-scrolling: touch;
scrollbar-width: none; /* Скрыть скроллбар в Firefox */
}
body::-webkit-scrollbar {
display: none; /* Скрыть скроллбар в Webkit (например, Safari, Chrome) */
}
.mobile-body {
overflow: hidden;
height: 100vh;
}
.mobile-wrap {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
overflow-x: hidden;
overflow-y: auto;
background: red;
}
.mobile-content {
height: calc(100% + 1px);
background: green;
}
我将非常感激和高兴至少有一些有关修复此错误的信息,谢谢!
有一个通过 HDMI 连接的小显示器。显示器现在作为“屏幕扩展”连接。怎样才能单独连接呢?这样鼠标光标就不会转到第二个屏幕?
你需要制作一个旋转木马,中间有一张大图片,两侧有小图片,如图所示:
我决定使用 Slick 滑块。 Slick 有一个相应的配置centerMode: true用于类似的目的,有相当多的使用示例。使用 CSS 属性放大中心图像:transform: scale();
scale();但是......可以设置的最大值1.5是当超过该阈值并进一步增加时 - 中心图片与相邻图片重叠,并且在大尺寸时完全覆盖它们。使用 CSS 属性强制放大具有中心图像的容器width会导致中心图像从中心移至侧面 - 尺寸和居中由 Slick 脚本计算并根据图像的统一大小进行定制。
我如何使用 Slick 解决此问题,或者您可以推荐另一个库脚本来完成此任务吗?
$(document).ready(function() {
$('.slider').slick({
centerMode: true,
centerPadding: '0px',
nextArrow: '.project__next',
slidesToShow: 5
});
});
.slick-center img {
opacity: 1;
transform: scale(1.5);
}
.slick-slide img {
width: 80px;
height: 80px;
}
.slick-slide {
padding-top: 20px;
}
.slick-center {
padding-top: 0;
}
.project__next img{
width:50px;
height:20px;
}
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/[email protected]/slick/slick.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/[email protected]/slick/slick.css" />
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/[email protected]/slick/slick-theme.css" />
<div class="slider">
<div>
<img src="https://images.unsplash.com/photo-1512300872216-54ef7791f155?ixlib=rb-0.3.5&ixid=eyJhcHBfaWQiOjEyMDd9&s=18b9a3e2bbc98783513eea4cb4b6b9bd&auto=format&fit=crop&w=600&q=60" alt="">
</div>
<div>
<img src="https://images.unsplash.com/photo-1512300872216-54ef7791f155?ixlib=rb-0.3.5&ixid=eyJhcHBfaWQiOjEyMDd9&s=18b9a3e2bbc98783513eea4cb4b6b9bd&auto=format&fit=crop&w=600&q=60" alt="">
</div>
<div>
<img src="https://images.unsplash.com/photo-1512300872216-54ef7791f155?ixlib=rb-0.3.5&ixid=eyJhcHBfaWQiOjEyMDd9&s=18b9a3e2bbc98783513eea4cb4b6b9bd&auto=format&fit=crop&w=600&q=60" alt="">
</div>
<div>
<img src="https://images.unsplash.com/photo-1512300872216-54ef7791f155?ixlib=rb-0.3.5&ixid=eyJhcHBfaWQiOjEyMDd9&s=18b9a3e2bbc98783513eea4cb4b6b9bd&auto=format&fit=crop&w=600&q=60" alt="">
</div>
<div>
<img src="https://images.unsplash.com/photo-1512300872216-54ef7791f155?ixlib=rb-0.3.5&ixid=eyJhcHBfaWQiOjEyMDd9&s=18b9a3e2bbc98783513eea4cb4b6b9bd&auto=format&fit=crop&w=600&q=60" alt="">
</div>
<div>
<img src="https://images.unsplash.com/photo-1512300872216-54ef7791f155?ixlib=rb-0.3.5&ixid=eyJhcHBfaWQiOjEyMDd9&s=18b9a3e2bbc98783513eea4cb4b6b9bd&auto=format&fit=crop&w=600&q=60" alt="">
</div>
</div>
<div class="project__next">
<span>Next</span><img src="http://www.clker.com/cliparts/B/5/C/M/6/i/right-grey-arrow.svg">
</div>
给定 3D 空间中的一条线段(或多段线段)。您需要使用用户指定的特定倾斜角度(以度为单位)构建选定线段的法线。
如果倾斜角度指定为 0 到 90(含),则旋转角度是正确的,但是,如果角度大于 90,则旋转角度为相反方向。例如,如果输入 100 度的值,则倾斜角度将变为 80 度;如果指定 120 度,则为 60 度。
此外,任何角度的法线都应顺时针构建。
如果您能给我解释一下垫子,我将非常感激。这个问题的一部分...
PS 全局变量Angle已经转换为弧度了。
if (Angle != 0)
{
Double cos = Math.Cos(Angle);
Double sin = Math.Sin(Angle);
Double tan = Math.Tan(Angle);
Vertex VA = new Vertex(0, 0, 1);
Vertex axisN = GetULikeMatrix().TransformNormal(VA).Normalize();
Vertex initialPoint = MV.Inverse().Transform(Point1);
Vertex targetPoint = MV.Inverse().Transform(V);
Double edgeLength = new Edge(initialPoint, targetPoint).Length();
Double height = edgeLength * Math.Abs(tan);
// Задается угол поворота с помощью тангенса.
V = targetPoint + axisN * height;
if (Math.Round(cos, 3) == 0)
{
if (sin > 0) V = initialPoint + axisN * edgeLength;
if (sin < 0) V = initialPoint - axisN * edgeLength;
}
// Задается необходимая длина.
V = initialPoint + (V - initialPoint).Normalize() * edgeLength;
V = MV.Transform(V);
}
