美文网首页
HTML往herf超链接中插入变量

HTML往herf超链接中插入变量

作者: 丑小丫_91b3 | 来源:发表于2019-02-26 10:58 被阅读0次

    遇到这个问题时在网上查到了挺多答案,但似乎都不太好使,后来就自己写了个函数,解决了一下这个问题。
    问题:

     screen =  (
                    <ol className='tb'>
                        {items.result.map((item,index) =>
                            <li key={index} className='tb'>
                               <div className='main'>
                                    <div className='contact-details'>
                                        <center>
                                            <h1>{item[0]}</h1>
                                        <p>{item[1]}</p>
                                       //想给href后面的url加变量
                                        <a href ="http://localhost:63343/web-p/web-project/src/Result/Result.html?item=">show>>></a>
                                        </center>
                                    </div>
                                    <div>
                                    </div>
                               </div>
                            </li>
                        )}
                    </ol>)
    

    解决:

    replaceMessage(value){
            var url;
            url="http://localhost:63343/web-p/web-project/src/Result/Result.html?item="+value;
            return url;
        }
     screen =  (
                    <ol className='tb'>
                        {items.result.map((item,index) =>
                            <li key={index} className='tb'>
                               <div className='main'>
                                    <div className='contact-details'>
                                        <center>
                                            <h1>{item[0]}</h1>
                                        <p>{item[1]}</p>
                                            <a href ={this.replaceMessage(item)}>show>>></a>
                                        </center>
                                    </div>
                                    <div>
                                    </div>
                               </div>
                            </li>
                        )}
                    </ol>)
    

    效果:
    网上找了一个免费的淘宝接口,在另一个页面获取了一下数据做显示


    2019-02-26 10-54-15search.png
    2019-02-26 10-54-50show.png

    相关文章

      网友评论

          本文标题:HTML往herf超链接中插入变量

          本文链接:https://www.haomeiwen.com/subject/nyooyqtx.html