我正在创建一个触发按钮；或者CTA按钮，如果你想这样称呼它。用户可以选择是下载还是正常重定向。如果是下载，我希望块添加download 在锚定标记的末尾
<a href="#" download>foo</a>
How would I let the save return check if the user choose btntype download and change the anchor tag based on that?
基本上，我需要的是这种逻辑的工作版本：
if btntype === download { <a href="#" download>foo</a> } else { <a href="#">foo</a> };这是触发按钮的完整代码块
/**
* WP Dependency
*/
import { URLInput } from \'@wordpress/block-editor\';
const { registerBlockType } = wp.blocks;
const { __ } = wp.i18n;
const RichText = wp.editor.RichText;
const { PanelBody, PanelRow, SelectControl } = wp.components;
const {
InspectorControls,
URLinput,
} = wp.editor;
/**
* Internal dependencies
*/
import \'./style.scss\';
/**
* Register block
*/
registerBlockType( \'re-blockz/btn\',
{
title: wp.i18n.__( \'Trigger Button\', \'re-blockz\' ),
category: \'re-blockz\',
icon: \'button\',
attributes: {
btntitle: {
type: \'string\',
source: \'html\',
selector: \'.btntitle\',
},
btntext: {
type: \'string\',
source: \'html\',
selector: \'.btntext\',
},
icontype: {
type: \'string\',
default: \'chevron_right\',
},
btntype: {
type: \'string\',
default: \'rel\',
},
btncolor: {
type: \'string\',
default: \'blue\',
},
btnurl: {
type: \'string\',
}
},
supports: {
html: false,
},
edit( props ) {
const {
attributes,
className,
setAttributes,
} = props;
const {
btntitle,
btntext,
btnurl,
btncolor,
btntype,
icontype,
} = attributes;
return (
<div className={className}>
<InspectorControls>
<PanelBody
title="Button Einstellungen"
initialOpen={true}
>
<PanelRow>
<URLInput
label="Link auswählen:"
className={ className }
value={ btnurl }
onChange={ ( btnurl, post ) => setAttributes( { btnurl, btntext: (post && post.title) || \'Link hinzufügen\' } ) }
/>
</PanelRow>
<PanelRow>
<SelectControl
label="Link-typ wählen"
value={attributes.icontype}
options={[
{label: "Weiterleitung", value: \'chevron_right\'},
{label: "Beitrag", value: \'notes\'},
{label: "Hervorhebung", value: \'star_rate\'},
{label: "Touch", value: \'touch_app\'},
{label: "Download", value: \'get_app\'}
]}
onChange={(newval) => setAttributes({ icontype: newval })}
/>
<SelectControl
label="Klick-Verhalten"
value={attributes.btntype}
options={[
{label: "Verlinkung", value: \'rel\'},
{label: "Download", value: \'download\'}
]}
onChange={(newval) => setAttributes({ btntype: newval })}
/>
<SelectControl
label="Button Farbe"
value={attributes.btncolor}
options={[
{label: "Blau", value: \'c_blue\'},
{label: "Gelb", value: \'c_yellow\'}
]}
onChange={(newval) => setAttributes({ btncolor: newval })}
/>
</PanelRow>
</PanelBody>
</InspectorControls>
<div class="btn-trigger">
<div class="btninner">
<div class="btnleft">
<RichText
tagName="h3"
value={ btntitle }
className="btntitle"
onChange={ ( value ) => setAttributes( { btntitle: value } ) }
placeholder={ __( \'Titel des Button ...\', \'re-blockz\' ) }
keepPlaceholderOnFocus
/>
<RichText
tagName="p"
value={ btntext }
className="btntext"
onChange={ ( value ) => setAttributes( { btntext: value } ) }
placeholder={ __( \'Text des Button ...\', \'re-blockz\' ) }
keepPlaceholderOnFocus
/>
</div>
<div class="btnright">
<div class="icon">
<span class="material-icons">{ icontype }</span>
</div>
</div>
</div>
</div>
</div>
);
},
save( { attributes } ) {
const {
btntitle,
btntext,
btnurl,
icontype,
btncolor,
btntype,
} = attributes;
return (
<a href={ btnurl } class="btn-trigger" { btntype }>
<div class="btninner">
<div class="btnleft">
<RichText.Content
tagName="h3"
className="btntitle"
value={ btntitle }
/>
<RichText.Content
tagName="p"
className="btntext"
value={ btntext }
/>
</div>
<div className={ btncolor }>
<div class="icon">
<span class="material-icons">{ icontype }</span>
</div>
</div>
</div>
</a>
);
},
}
);
在此代码中
btntype 在锚定标签的末尾，我犯了一个预期错误，tho，我只是想说一下，这是我尝试对问题进行粗略而肮脏的快速修复，直到我有更多的时间来阅读主题。
Syntax error: C:/0-dev/xxx/re/blocks/src/button/index.js: Unexpected token, expected ... (163:45)
161 | } = attributes;
162 | return (
> 163 | <a href={ btnurl } class="btn-trigger" { btntype }>
| ^
164 | <div class="btninner">
165 | <div class="btnleft">
166 | <RichText.Content
