编辑:这是错误报告 - https://github.com/ionic-team/ionic/issues/16797#issuecomment-457919043
我对原生 Ionic 的修复是在 4.0.0 发布时将其添加到 Capacitor Json 文件中:
"Keyboard": {
"resize": "ionic"
}
它在 Safari 中仍然存在相同的问题,并且我在 Capacitor GitHub 报告上发布的 Native iOS 中的 Capacitor 和选项卡存在问题,该报告刚刚关闭,应该在下一个版本中推送。
下面是页面的 HTML。当我点击底部的文本框时,键盘显示在文本框上,不允许它被看到。下图也是。
是不是因为新的iOS键盘的高度?我在图中的三个下方添加了一个新输入,并在模拟器上进行了尝试,因此它位于键盘顶部下方。还是一样的问题。
它不在页脚中,也不在 Ionic 3 中,所以我找不到另一个类似的问题。
<ion-content padding>
<ion-card>
<ion-card-header> New Password </ion-card-header>
<ion-card-content> Change the password for {{ username }}. </ion-card-content>
</ion-card>
<form [formGroup]="changePasswordForm" (ngSubmit)="changePassword()">
<ion-item no-padding margin>
<ion-label position="stacked">Current Password</ion-label>
<ion-input formControlName="oldPassword" type="password"></ion-input>
</ion-item>
<ion-item no-padding margin>
<ion-label position="stacked">New Password</ion-label>
<ion-input formControlName="password" type="password"></ion-input>
</ion-item>
<ion-item no-padding margin>
<ion-label position="stacked">Confirm New …Run Code Online (Sandbox Code Playgroud) 编辑:我在下面实现,将其发布到GitHub以进行用户身份验证。
根据评论编辑:DTO 文件能否被@nestjs/graphql 基于 GraphQL 类型生成的类替换?我可以通过生成这些类来创建 NestJS / MongoDB / Mongoose / GraphQL 应用程序,然后为我的 MongoDB Schema 扩展它们。然后,在此问题之后,欢迎任何最佳实践意见,但将接受回答上述问题的答案。以下是原帖:
描述用户模型的最佳方式是什么?是否定义了 graphQL 类型并使用它来生成类来替换dto文件并导入 Mongoose 以用于 MongoDB 模式?下面我将解释我在做什么,以及什么可能更好。我自己重复的文件数量似乎不可扩展。
以下是我描述同一用户的多种方式:
users.types.graphql - GraphQL 类型,包含创建用户输入、更新用户输入等。它包含以下内容:
type Mutation {
createUser(createUserInput: CreateUserInput): User
}
input CreateUserInput {
username: String
email: String
password: String
}
type User {
_id: String!
username: String
email: String
password: String
}
Run Code Online (Sandbox Code Playgroud)
user.interfaces.ts - 描述由 MongoDB Schema 和我的 user.service.ts 使用的用户类型,其中包含:
export interface IUser {
email: string;
password: string;
username: string; …Run Code Online (Sandbox Code Playgroud) 编辑:接受的答案帮助我解决了问题。这是正确的,所以我接受了。但我正在导入包含标签的模块body,但没有使用它。
import styles from "./App.module.css"; //Includes a body tag
styles代码中没有使用任何地方,所以我认为 WebPack 没有包含它。如果我对该模块做了任何事情,则包含 body 标签并且它可以工作。<div className={styles.anything}>允许body包含 CSS。
正如回答者在评论中所说,这可能是由于 Typescript 造成的。
我曾经create-react-app制作过一个应用程序。我在我的组件中使用 CSS 模块。我试图弄清楚如何使用 CSS 模块使页面的整体背景具有不同的颜色。
我想应用background-color: #121212;到整个背景。
我正在尝试找出如何应用该样式,现在看来需要将其应用于标签body。
应用于的任何样式App.tsx仅影响该组件占用的容器(背景仅在组件底部着色App,其下方为白色)
现在index.css包含
body {
...
background-color: #121212;
}
Run Code Online (Sandbox Code Playgroud)
这很好用。我想使用模块,但我不知道如何导入该样式来工作。
index.tsx我将在哪里导入使用 Webpack创建的文件的样式create-react-app。
ReactDOM.render(<App />, document.getElementById('root'));
编辑:解决方案是通过重新定义外部效果来重新定义每个渲染的回调timeline.on,但我不明白为什么这仍然是必要的。
编辑2:我意识到我需要为每个渲染重新添加和删除所有侦听器。这是工作代码。我仍然不明白为什么原始问题不起作用的范围概念。
useEffect(() => {
const onSelect = (properties: { items: IdType[]; event: MouseEvent }) => {
if (!(properties.items.length > 0)) return;
const selectedItem = items.find(item => item.id === properties.items[0]);
if (selectedItem) onItemSelect(selectedItem);
};
const addListeners = (listenerTimeline: VisTimeline) => {
listenerTimeline.on('select', onSelect);
};
const removeListeners = (listenerTimeline: VisTimeline) => {
return () => {
listenerTimeline.off('select', onSelect);
};
};
if (timeline) {
addListeners(timeline);
return removeListeners(timeline);
}
if (!timeline) {
const newTimeline = new VisTimeline(container.current, items, groups, options);
addListeners(newTimeline); …Run Code Online (Sandbox Code Playgroud) 我正在尝试通过我的API执行更新.当我推送更新时,我没有所有必需的字段,因为我只是尝试更新已更改的字段.我得到400"这个字段是必需的." 错误.
我知道该字段是必需的,但我正在尝试更新,而不是再次放入所有必填字段.这是一个PUT请求.这在我的序列化程序上调用create或update之前发生.它在is_valid()调用(我没有覆盖)上失败.老实说,没有任何相关的代码可以显示.要解决此问题,我必须覆盖is_valid并在那里提供密码吗?
例如:密码是我的模型中的必填字段.但是我只推送"first_name",因为这是唯一改变的字段.我会得到:密码":["此字段是必填项."].
我有Angular谷歌地图工作,但我的网站上没有显示地图.我的JS加载地图,我可以打印出地图属性.最重要的是,当我访问我的Chrome AngularJS调试器时,我可以看到生活在我的范围内的地图图片,但它没有显示在我的页面上.在Google的API页面上,我可以看到正在发出请求.那么我做错了什么导致它实际上没有显示这张地图?该视图通过带有ng-routes的ng-view指令导入.
感谢您的任何帮助!

角度:
uiGmapGoogleMapApiProvider.configure({
key: 'MY_KEY',
v: '3.17',
libraries: 'weather,geometry,visualization'
})
tripApp.controller('TripsController', ['$scope', 'uiGmapGoogleMapApi',
function ($scope, uiGmapGoogleMapApi) {
uiGmapGoogleMapApi.then(function (maps) {
$scope.map = {center: {latitude: 39.8433, longitude: -105.1190}, zoom: 10};
})
}])
Run Code Online (Sandbox Code Playgroud)
相关HTML:
<script src="./assets/js/angular-google-maps.js"></script>
<script src="./assets/js/lodash.js"></script>
<link rel="stylesheet" type="text/css" href="/app/trips/viewtrips.css">
<div ng-controller="TripsController as tripCtrl">
<ui-gmap-google-map center='map.center' zoom='map.zoom'></ui-gmap-google-map>
</div>
Run Code Online (Sandbox Code Playgroud)
CSS
.angular-google-map-container {
height: 300px;
}
.angular-google-map {
height: 300px;
}
Run Code Online (Sandbox Code Playgroud)
编辑:包括我的CSS导入.看来我的项目中的CSS没有正确加载.检查元素显示零高度.如果我单击该元素,虽然它已导入,但它不会显示我的.css.我在小提琴上复制了代码并且它有效,但是如果我删除了css部分,我会得到类似的行为.如果我使用PyCharm在liveEdit中运行代码,它会给我一个问题,但如果我在PyCharm中打开它时修改.css文件,地图会弹出!刷新 - 它消失了.
在实时编辑之前,Chrome的开发人员窗格中的.angular-google-map css样式不在其中列出元素的所有样式.然后我用liveEdit修改.css文件并显示地图,样式从viewtrips.css第7行更改为.angular-google-map.为什么在第一次加载时没有正确加载样式?:
我收到警告Warning: Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()?。我很困惑,因为我正在使用forwardRef()......而且它正在工作。
我正在尝试将我的自定义输入元素传递给 ReactDatePicker。在这方面有几个 GitHub 问题,例如 this one。但是我无法在执行那里的示例时解决最后一个错误。
这是自定义Input元素:
interface InputProps extends InputHTMLAttributes<HTMLInputElement> {
ref?: React.Ref<HTMLInputElement>;
}
const StyledInput = styled.input<InputProps>`
box-sizing: border-box;
// ...
`;
export const Input: FunctionComponent<InputProps> = (props: InputProps) => {
return (
<>
<StyledInput {...props}></StyledInput>
</>
);
};
Run Code Online (Sandbox Code Playgroud)
这是发生错误的带有 ReactDatePicker 的自定义 DatePicker:
interface DatePickerProps extends ReactDatePickerProps {
//... custom props …Run Code Online (Sandbox Code Playgroud) 我有一个简单的问题:目前,我可以从后端获取一个对象:
http://127.0.0.1:8000/api/v1/boats/boats?id=10
http://127.0.0.1:8000/api/v1/boats/boats?home_port=98&id=5
Run Code Online (Sandbox Code Playgroud)
但是我想根据ID列表或home_ports列表获取一系列船只,并且尝试了:
http://127.0.0.1:8000/api/v1/boats/boats?id=10,11
http://127.0.0.1:8000/api/v1/boats/boats?id_in=10,11
http://127.0.0.1:8000/api/v1/boats/boats?id=10,id=11
http://127.0.0.1:8000/api/v1/boats/boats?id=10&id=11
Run Code Online (Sandbox Code Playgroud)
但是这些不起作用。用django-filter做到这一点的最好方法是什么,URL规则是如何定义的?
这是我的看法:
class BoatList(generics.ListCreateAPIView):
permission_classes = (IsOwnerOrReadOnly,)
serializer_class = BoatSerializer
queryset = Boat.objects.all()
filter_backends = (filters.DjangoFilterBackend,)
filter_fields = ('id', 'home_port',)
Run Code Online (Sandbox Code Playgroud)
我标记为接受的解决方案100%回答了我的问题,但最终我根据发现的另一篇使用过滤器的帖子实施了一些不同的操作:
class ListFilter(Filter):
def filter(self, qs, value):
if not value:
return qs
self.lookup_type = 'in'
values = value.split(',')
return super(ListFilter, self).filter(qs, values)
class BoatFilter(FilterSet):
ids = ListFilter(name='id')
class Meta:
model = Boat
fields = ['home_port', 'ids']
class BoatList(generics.ListCreateAPIView):
permission_classes = (IsOwnerOrReadOnly,)
serializer_class = BoatSerializer
queryset = Boat.objects.all()
filter_backends = (filters.DjangoFilterBackend,)
filter_class = …Run Code Online (Sandbox Code Playgroud) 我有一个关于覆盖is_valid的快速问题.Self是一个rest_framework.serializers.ModelSerializer.我试图弄清楚是否有更好的方法来修改内部数据,而不是读取/写入data._kwargs属性.我知道我可以通过self.get_initial()调用获得数据预验证.但我也希望能够写出数据.这里的目的是将图像数据(如果格式不正确)更改为我们的模型接受的格式,以便我们的API更灵活.我知道可能还有其他方法可以实现我的目标,但我的一般性问题是"在调用is_valid()之前,是否有一种在序列化程序上设置数据的好方法?" 因为它也适用于其他情况.谢谢!
def is_valid(self, raise_exception=True):
imageHandler = ImageHandler()
if "member_profile" in self._kwargs["data"]:
if "profile_image" in self._kwargs["data"]["member_profile"]:
self._kwargs["data"]["member_profile"]["profile_image"] = imageHandler.convertImage(
self._kwargs["data"]["member_profile"]["profile_image"])
else:
self._kwargs["data"]["member_profile"] = {}
valid = super(AuthUserModelSerializer, self).is_valid(raise_exception=raise_exception)
return valid
Run Code Online (Sandbox Code Playgroud) undefined当oldRunIn触发效果时,以下代码的输出符合预期:
效果正在运行
setState 正在运行
但是,下次 useEffect 运行时runInArrow定义了状态变量(在 setState 函数中引用),oldRunInArrow输出为:
效果正在运行
setState 正在运行
setState 正在运行
setState 正在运行
怎么可能effect只运行了一次而setState运行了3次呢?
const [runInArrow, setRunInArrow] = useState<mapkit.PolylineOverlay[] | undefined>(undefined);
useEffect(() => {
const trueRunIn = settings.magneticRunIn + magVar;
const boundingRegion = region.toBoundingRegion();
const style = new mapkit.Style({
lineWidth: 5,
lineJoin: 'round',
strokeColor: settings.runInColor,
});
const newRunInArrow = createArrow(boundingRegion, trueRunIn, style);
console.log('Effect is running');
setRunInArrow(oldRunIn => {
// This runs too many times when oldRunIn aka runInArrow is defined
console.log('setState is …Run Code Online (Sandbox Code Playgroud) javascript ×4
reactjs ×4
django ×3
api ×2
python ×2
angularjs ×1
css ×1
css-modules ×1
google-maps ×1
graphql ×1
html ×1
ionic4 ×1
mongodb ×1
mongoose ×1
nestjs ×1
next.js ×1
overriding ×1
react-hooks ×1
rest ×1
typescript ×1