视图.py
map = folium.Map(location=[df['latitude'].mean(),
df['longitude'].mean()],tiles="cartodbpositron",zoom_start=12)
map.save("map.html")
context = {'my_map': map}
return render(request, 'my_map.html', context)
my_map.html：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
{{ my_map }}
</body>
浏览器结果：
folium.folium.Map object at 0x7f49d85662b0
我不确定在用户通过之前的 html 表单提交输入后如何让 html/js 在浏览器上工作...我似乎到处都在寻找，并且有很多类似的解决方案问题，但我可以没有人去工作！
谢谢！
地形版本 = 0.12
resource "aws_instance" "bespin-ec2-web" {
ami = "ami-0bea7fd38fabe821a"
instance_type = "t2.micro"
vpc_security_group_ids = [aws_security_group.bespin-sg.id]
subnet_id = aws_subnet.bespin-subnet-public-a.id
associate_public_ip_address = true
tags = {
Name = "bespin-ec2-web-a"
}
user_data = data.template_file.user_data.rendered
}
data "template_file" "user_data" {
template = file("${path.module}/userdata.sh")
}
用户数据.sh 文件
#!/bin/bash
USERS="bespin"
GROUP="bespin"
for i in $USERS; do
/usr/sbin/adduser ${i};
/bin/echo ${i}:${i}1! | chpasswd;
done
cp -a /etc/ssh/sshd_config /etc/ssh/sshd_config_old
sed -i 's/PasswordAuthentication no/#PasswordAuthentication no/' /etc/ssh/sshd_config
sed -i 's/#PasswordAuthentication yes/PasswordAuthentication yes/' /etc/ssh/sshd_config
systemctl restart sshd
地形计划结果
Error: failed …我在互联网上发现了这个“只要状态或道具发生变化，反应组件就会自动重新渲染”，但是如果在道具中我传递了与状态不同的东西，它不会引发渲染，即使道具已经改变在时间里。
在此代码中，我传递了一个 prop 而不使用状态
家长
import React from "react";
import Child from "./child";
export default function Parent() {
let count = 0;
setInterval(() => {
count++;
console.log(count);
}, 1000);
return <Child count={count} />;
}
孩子
import React from "react";
export default function Child(props) {
console.log("render from child"); //console.log once
return <h1>{props.count}</h1>;
}
谢谢你帮助我解决我心中的混乱
刚从点燃元素开始
在我的渲染中我有：
return html`
${this.jobCreate}
${this.jobDetails}
`;
找工作创建工作正常
这是我的工作详情：
get jobDetails() {
const jobs = [
{ name: "phoenix job", location: "phoenix", expires: "2020-10-01" },
{ name: "chicago job", location: "chicago", expires: "2020-10-01" },
{ name: "pittsburgh job", location: "pittsburgh", expires: "2020-10-01" },
];
return html`<ul>
${jobs.forEach((job) => html`<li>${job.name}</li>`)}
</ul>`;
}
检查元素我可以看到一个空<ul>集
如果做一个<ul><li>${jobs[2].name}</li></ul>有效的
如果我控制台输出作业，我可以看到所有正确的作业在循环中打印 3 次
我不明白为什么我不能得到<li>在循环中渲染
我用这个作为参考：https ://lit-element.polymer-project.org/guide/templates#template-syntax-cheat-sheet
我正在建立一个部分列表。每个部分都有一个具有不同值的不同数据对象。因此，我需要为每个部分渲染不同的组件，但我很难弄清楚如何做到这一点。
这是我的DATA数组（现在有两个是虚拟的）
const DATA = [
{
title: "Groups",
data: [
{
groupName: "Samwise",
},
],
},
{
title: "Noters"
{
userName: "Merri",
},
],
},
{
title: "Contacts",
data: termIsContact.length ? termIsContact : contacts,
}]
部分列表组件
<SectionList
sections={DATA}
keyExtractor={(item, index) => item + index}
renderItem={renderItem}
renderSectionHeader={({ section: { title } }) => (
<View style={tw.style(`justify-center bg-red-100 pl-4`, { height: 28 })}>
<Text style={tw`text-base font-bold`}>{title}</Text>
</View>
)}
/>
我如何呈现联系人列表
const Item = ({ givenName, familyName }) => ( …我如何在 Angular 中渲染对象的对象，但不将其转换为数组或类似的内容。原因是我有一个很大的对象，我想避免在 html 中循环数组之后从对象到数组的多次迭代。
例如我有：
persons: any = {
0: { name: 'name1', email: 'name1@gmail.com' },
1: { name: 'name2', email: 'name2@gmail.com' },
2: { name: 'name3', email: 'name3@gmail.com' }
}
当我这样做时，如下：
<div *ngFor="let person of persons | keyvalue">
<p>
{{ person.key }} / {{ person.value }}
</p>
</div>
结果是：
0 / [object Object]
1 / [object Object]
2 / [object Object]
我尝试再循环一次 person.value：
<div *ngFor="let person of persons | keyvalue;">
<p>
{{ person.key }}
<span *ngFor="let item of …在我的网站中，我有一个按钮可以在特定的 div 中启动反应应用程序。当我点击它时，我创建一个反应根 div 并在里面渲染反应应用程序。关闭它的正确方法是什么？
<!--HTML from the website -->
<body>
<button id="btn">Launch React App</button>
<script type="module" src="/src/main.tsx"></script>
</body>
//main.js from the react App
import React from "react";
import ReactDOM from "react-dom/client";
import "./global.scss";
import App from "./App";
const btn = document.getElementById("btn");
btn.onclick = () => {
const root_div = document.createElement("div");
root_div.id = "root";
document.body.appendChild(root_div);
const root = ReactDOM.createRoot(root_div);
root.render(
<React.StrictMode>
<App />
</React.StrictMode>
);
};
如何防止 React 中子组件的重新渲染？每次在父级更新 useState 中保存的 ID 时，子级都会重新渲染并失去选择。
以下是一些设置示例代码：
父组件：
import React, { useState } from "react";
import ChildComponent from "./ChildComponent";
function ParentComponent() {
const [selectedProjectId, setSelectedProjectId] = useState("");
const handleProjectIdChange = (projectId) => {
setSelectedProjectId(projectId); //<--- this rerenders the ChildComponent which is NOT wanted
};
return (
<div>
<h1>Parent Component</h1>
<ChildComponent
selectedProjectId={selectedProjectId}
onProjectIdChange={handleProjectIdChange}
/>
<p>Selected project ID: {selectedProjectId}</p>
</div>
);
}
export default ParentComponent;
子组件：
import React, { useState } from "react";
function ChildComponent({ selectedProjectId, onProjectIdChange }) {
const [projectOptions, …我正在编写一个管理用户文档的应用程序,并(最终)发布通过iPhone/iPad上的Web服务提供的PDF文件.这几乎是完全扫描的PDF文件,它们似乎真的让iOS设备陷入困境.
我想出的第一个解决方案是在UIWebView中简单地托管PDF.这对于"生成的"PDF文件非常有效,但不适用于扫描的PDF文件(我猜这里的区别是光栅与矢量？).
我的下一个解决方案是实现一个UIDocumentInteractionController,据说这会增加快速性.我可以报告它确实比UIWebView更快,但它仍然慢得令人无法接受,即使在2页的小PDF文件中也是如此.(另一方面,"自动打开另一个应用程序"功能,以及内置打印是超级光滑!)
我已经阅读了关于QuickLook框架的帖子或2,我打算调查一下,但我也偶然发现了一些关于CGPDFDocument类等的帖子.那些似乎对文档导航有更好的控制(la xPdf),但我不知道从哪里开始.另外,我甚至不确定它是否为我正在做的事情提供了性能优势.
那么,第一个问题:在iPhone/iPad上渲染扫描PDF文件的最快方法是什么？
第二个问题:扫描的PDF文件是由我公司生成的,因此我可以控制PDF生成设置.有谁知道哪些设置可以提高基于图像的PDF文件的加载速度？
谢谢!
(顺便说一下:我今天已连续19个小时编码,所以如果我漫无目的或没有意义,请原谅我!:))
render ×10
reactjs ×4
javascript ×2
angular ×1
bash ×1
deployment ×1
dictionary ×1
django ×1
folium ×1
ios ×1
ipad ×1
iphone ×1
lit-element ×1
ngfor ×1
node.js ×1
object ×1
pdf ×1
python ×1
react-native ×1
react-props ×1
rerender ×1
root ×1
state ×1
terraform ×1
typescript ×1
unmount ×1