Deepseek ArtifactsDeepseek Artifacts
Back to blocks

美化WhatsApp按钮代码

4.0
es编程前端开发代码优化WhatsApp集成

Prompt

make beautiful the following code please, without tailwind, adding the whatsapp logo and resaltando the text

	            <button className='whatsapp-button' onClick={openWhatsApp}>
              <i className="fa fa-whatsapp"></i> Comunicate con él al instante por WhatsApp
            </button>

Resultado Generado

import React from 'react';
import './App.css';

const App = () => {
  const openWhatsApp = () => {
    window.open('https://wa.me/1234567890', '_blank');
  };

  return (
    <div className='app-container'>
      <button className='whatsapp-button' onClick={openWhatsApp}>
        <img src='https://placehold.co/24x24' alt='WhatsApp' />
        <span>Comunicate con él al instante por WhatsApp</span>
      </button>
    </div>
  );
};

export default App;
Open on CodeSandboxOpen Sandbox

Más Recomendaciones

Ver Todo

PHP Textarea 大小写转换

编程en
4.0

i have a textarea named Diagnosis in my table named Histology_Report, convert textarea to uppercase as you type in phprunner

PHPTextareaUppercase20/6/2025

Discord Bot编程指南

编程en
4.0

a discord bot like pro bot i use vs code so i need java script language

Discord BotJavaScriptVS Code17/6/2025

修复代码：无axios

编程en
4.0

please correct for me this code, no axios useEffect(() => { const fetchData = async () => { try { const response = await axios.get('https://www.technosysa.com/new_announce.php', { params: { id: idParam, mode: 'get_announce' }, headers: { 'Content-Type': 'application/json', } }); console.log(response.data); setItem( { id: idParam, description: response.data.description, Name_person: response.data.Name_person, telefono: response.data.telefono, whatsapp: response.data.whatsapp, email: response.data.email, file_path_user_jpg: file_path_user_jpg } ); } catch (error) { console.error('Error fetching data:', error.data); } }; fetchData(); });

代码修复ReactuseEffect14/6/2025

修正React代码示例

编程en
4.0

please correct for me this code: useEffect(() => { const fetchData = async () => { try { const response = await axios.get('https://www.technosysa.com/new_announce.php', { params: { id: idParam, mode: 'get_announce' }, headers: { 'Content-Type': 'application/json', } }); console.log(response.data); setItem( { id: idParam, description: response.data.description, Name_person: response.data.Name_person, telefono: response.data.telefono, whatsapp: response.data.whatsapp, email: response.data.email, file_path_user_jpg: file_path_user_jpg } ); } catch (error) { console.error('Error fetching data:', error.data); } }; fetchData(); });

ReactuseEffect代码修正14/6/2025

现代CSS美化代码

编程en
4.0

plase make very beauty and modern css the following code without use @import: <div className="App"> <header className="App-header"> <br /> <br /> <div className="row"> <div className="alignleft"> <i className="fa fa-bolt fa-3x"></i> </div>&nbsp&nbsp <form method="post" action="anuncia_new.php?mode=modificar"> <strong>{description}</strong> {/* \n" */} <div> {Name_person}<br />{telefono}<br />{email} </div> <input name="description" type="hidden" value={description}/> <input name="email" type="hidden" value={email}/> <input name="telefono" type="hidden" value={telefono}/> <input name="Name_person" type="hidden" value={Name_person}/> <input name="id" type="hidden" value={id}/> <br/> <button className="btn btn-success btn-lg" type="submit" >Modificar</button> </form> </div> <br/> {file_path_user_jpg && <> <div className="row "> <div className="center-block"> <div className="col-md-3 "> <div className="gradient-box"> <a target="_blank" rel='noreferrer' href={file_path_user_jpg}> <img src={file_path_user_jpg} alt="" style={{width:"150px"}} /> </a></div> </div> </div> </div> <br /> <br /> </> } <br /> <br /> <br /> </header> </div>

CSS前端开发代码美化13/6/2025

C++编程指南

编程en
4.0

cpp code

C++编程代码11/6/2025