[Params adjustment]

This commit is contained in:
CPunisher 2020-05-04 22:52:27 +08:00
parent fdf1f1c0a0
commit 58535095e5
4 changed files with 55 additions and 41 deletions

View File

@ -13,6 +13,10 @@ class QrItem extends React.Component {
this.handleClick = this.handleClick.bind(this); this.handleClick = this.handleClick.bind(this);
} }
componentDidMount() {
this.forceUpdate()
}
handleClick(e) { handleClick(e) {
this.props.onSelected(this.props.index); this.props.onSelected(this.props.index);
} }

View File

@ -7,7 +7,7 @@ function listPoint(props) {
const qrcode = props.qrcode; const qrcode = props.qrcode;
const nCount = qrcode.getModuleCount(); const nCount = qrcode.getModuleCount();
const pointList = new Array(nCount); const pointList = new Array(nCount);
const params = props.getParamValue(); const params = props.params;
let id = 0; let id = 0;
for (let row = 0; row < nCount; row++) { for (let row = 0; row < nCount; row++) {
@ -33,21 +33,23 @@ function calViewBox(props) {
class QrRendererBase extends React.Component { class QrRendererBase extends React.Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.props.setParamInfo([ if (this.props.setParamInfo) {
{ this.props.setParamInfo([
key: '大小', {
default: 1 key: '大小',
}, default: 1
{ },
key: '定位点样式', {
default: 0, key: '定位点样式',
choices: [ default: 0,
"矩形", choices: [
"圆形" "矩形",
] "圆形"
} ]
] }
); ]
);
}
} }
render() { render() {

View File

@ -50,25 +50,27 @@ function calViewBox(props) {
class QrRendererRound extends React.Component { class QrRendererRound extends React.Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.props.setParamInfo([ if (this.props.setParamInfo) {
{ this.props.setParamInfo([
key: '没有choices的文本框1', {
default: 1 key: '没有choices的文本框1',
}, default: 1
{ },
key: '没有choices的文本框2', {
default: 100 key: '没有choices的文本框2',
}, default: 100
{ },
key: '有choices的选择框', {
default: 0, key: '有choices的选择框',
choices: [ default: 0,
"option1", choices: [
"option2" "option1",
] "option2"
} ]
] }
); ]
);
}
} }
render() { render() {

View File

@ -53,9 +53,14 @@ class Qrcode extends React.Component {
} }
componentDidMount() { componentDidMount() {
this.setState({paramInfo: this.paramInfoBuffer, paramValue: this.paramValueBuffer}, () => { const text = 'https://qrbtf.com/';
this.handleCreate(); this.setState({
}) paramInfo: this.paramInfoBuffer,
paramValue: this.paramValueBuffer,
text: text,
options: {text: text},
qrcode: getQrcodeData({text: text})
});
} }
setParamInfo(index) { setParamInfo(index) {
@ -95,13 +100,13 @@ class Qrcode extends React.Component {
downloadSvg(e) { downloadSvg(e) {
const style = styleList[this.state.selectedIndex] const style = styleList[this.state.selectedIndex]
const el = React.createElement(style.renderer, {qrcode: this.state.qrcode}) const el = React.createElement(style.renderer, {qrcode: this.state.qrcode, params: this.state.paramValue[this.state.selectedIndex]})
saveSvg(style.value, ReactDOMServer.renderToString(el)) saveSvg(style.value, ReactDOMServer.renderToString(el))
} }
downloadImg(e) { downloadImg(e) {
const style = styleList[this.state.selectedIndex] const style = styleList[this.state.selectedIndex]
const el = React.createElement(style.renderer, {qrcode: this.state.qrcode}) const el = React.createElement(style.renderer, {qrcode: this.state.qrcode, params: this.state.paramValue[this.state.selectedIndex]})
saveImg(style.value, ReactDOMServer.renderToString(el), 1500, 1500) saveImg(style.value, ReactDOMServer.renderToString(el), 1500, 1500)
} }
@ -152,6 +157,7 @@ class Qrcode extends React.Component {
} }
render() { render() {
console.log(1)
return ( return (
<div> <div>
<div className="Qr-Centered"> <div className="Qr-Centered">
@ -181,7 +187,7 @@ class Qrcode extends React.Component {
qrcode={this.state.qrcode} qrcode={this.state.qrcode}
renderer={React.createElement(style.renderer, { renderer={React.createElement(style.renderer, {
qrcode: this.state.qrcode, qrcode: this.state.qrcode,
getParamValue: this.getParamValue(index), params: this.state.paramValue[index],
setParamInfo: this.setParamInfo(index) setParamInfo: this.setParamInfo(index)
})} })}
text={this.state.text} text={this.state.text}