React中样式绑定使用详解
May 24, 2018 pm 02:24 PM这次给大家带来React中样式绑定使用详解,React中样式绑定使用的注意事项有哪些,下面就是实战案例,一起来看一下。
普通样式名称使用 —— className
app.css
.c1{ color: red; width: 100%; height: 300px; border: solid 1px red; }
app.js
import './app.css' import React from 'react'; import ReactDOM from 'react-dom'; import './modules/cp/cp.scss' class Component1 extends React.Component{ render(){ return ( <p className="c1"></p> ) } } ReactDOM.render( <Component1 />, document.getElementById('app') )
行内样式
let c1 = { color: 'red', width: '100%', height: '300px', border: 'solid 1px red' } class Component1 extends React.Component{ render(){ console.log(c1) return ( <p style={c1}></p> ) } }
相信看了本文案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!
推荐阅读:
EasyCanvas绘图库在Pixeler项目开发中使用实战总结
Atas ialah kandungan terperinci React中样式绑定使用详解. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Artikel Panas

Alat panas Tag

Artikel Panas

Tag artikel panas

Notepad++7.3.1
Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina
Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1
Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6
Alat pembangunan web visual

SublimeText3 versi Mac
Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Topik panas

Apakah perisian crystaldiskmark? -Bagaimana menggunakan crystaldiskmark?

Penjelasan terperinci tentang mendapatkan hak pentadbir dalam Win11

Bagaimana untuk memuat turun foobar2000? -Cara menggunakan foobar2000

Cara menggunakan NetEase Mailbox Master

Cara menggunakan aplikasi Baidu Netdisk

Penjelasan terperinci tentang operasi bahagian dalam Oracle SQL

Ajar anda cara menggunakan ciri lanjutan baharu iOS 17.4 'Perlindungan Peranti Dicuri'

Tutorial BTCC: Bagaimana untuk mengikat dan menggunakan dompet MetaMask pada pertukaran BTCC?
