React中的內(nèi)聯(lián)CSS樣式：如何實現(xiàn)：hover？

lushan 發(fā)布于2019-08-21 18:38 / 3287人閱讀

摘要：這里主要介紹的是通過，事件來改變狀態(tài)希望大家喜歡，也希望大家指點錯誤，也可以加入群，大家一起討論，一起進步，后續(xù)更新中

這里主要介紹的是通過onMouseEnter，onMouseLeave事件來改變狀態(tài)

var Link = React.createClass({
  getInitialState: function(){
    return {hover: false}
  },
  toggleHover: function(){
    this.setState({hover: !this.state.hover})
  },
  render: function() {
    var linkStyle;
    if (this.state.hover) {
      linkStyle = {backgroundColor: "red"}
    } else {
      linkStyle = {backgroundColor: "blue"}
    }
    return(
      
        Link
      
    )
  }

希望大家喜歡，也希望大家指點錯誤，也可以加入qq群439667347，大家一起討論，一起進步，后續(xù)更新中...

GPU云服務(wù)器云服務(wù)器 vue綁定內(nèi)聯(lián)樣式 html的內(nèi)聯(lián)樣式 css內(nèi)聯(lián) 內(nèi)聯(lián)css

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://www.ezyhdfw.cn/yun/90664.html

相關(guān)文章

【全棧React】第9天: 樣式

摘要：我們將為組件賦值，并使用選擇器來定位頁面上的元素，讓瀏覽器處理樣式。的工作方式是將因此命名父樣式作為子樣式的樣式。這通常是錯誤的原因，因為類通常具有通用名稱，并且易于覆蓋非特定類的類樣式。反之，我們的樣式名稱需要使用駝峰命名方式。本文轉(zhuǎn)載自：眾成翻譯譯者：iOSDevLog鏈接：http://www.zcfy.cc/article/3820原文：https://www.fullsta...

zilu 2019-08-20 18:33 評論0 收藏0
React系列 --- 從使用React了解Css的各種使用方案(六)

摘要：當(dāng)然這不是只限于使用或者其他打包工具的方式都能支持使用優(yōu)點模塊化和可重用性沒有沖突顯性依賴不會污染全局可以配合預(yù)處理器使用少開發(fā)單獨文件寫法基本一致 To define is to limit. 定義一樣?xùn)|西，就意味著限制了它。——王爾德《道林·格雷的畫像》 React系列 React系列 --- 簡單模擬語法(一)React系列 --- Jsx, 合成事件與Refs(二)Reac...

freecode 2019-08-26 10:37 評論0 收藏0
【譯】統(tǒng)一樣式語言

摘要：原文地址原文作者譯文出自掘金翻譯計劃譯者校對者統(tǒng)一樣式語言在過去幾年中，我們見證了的興起，尤其是在社區(qū)。根本上來說，純粹用于只是一個命名規(guī)范，它要求樣式的類名要遵守的模式。原文地址：A Unified Styling Language 原文作者：Mark Dalgleish 譯文出自：掘金翻譯計劃譯者：ZhangFe 校對者：JackGit,yifili09 統(tǒng)一樣式語言在過...

fjcgreat 2019-08-29 12:49 評論0 收藏0
CSS常見問題小結(jié)

摘要：常見問題小結(jié)一行內(nèi)樣式內(nèi)聯(lián)樣式外部樣式行內(nèi)樣式代碼寫在具體網(wǎng)頁中的一個元素內(nèi)比如一般不需要擔(dān)心樣式優(yōu)先級與樣式覆蓋在制作頁面的時候需要為很多的標簽設(shè)置屬性，所以會導(dǎo)致頁面不夠純凈，文件體積過大不利于，后期維護成本高。 CSS常見問題小結(jié) 一、行內(nèi)樣式、內(nèi)聯(lián)樣式、外部樣式行內(nèi)樣式：代碼寫在具體網(wǎng)頁中的一個元素內(nèi)；比如：一般不需要擔(dān)心樣式優(yōu)先級與樣式覆蓋在制作頁面的時...

ivyzhang 2019-08-30 10:48 評論0 收藏0
如何把 alibaba Rax 組件轉(zhuǎn)換到 React 下

摘要：如何轉(zhuǎn)換知道了二者的不同，那么如何轉(zhuǎn)換我們也就有方向了。因為下每個元件本身就是一個普通的組件，我們可以通過直接把他們當(dāng)作其他組件轉(zhuǎn)換為的代碼來使用。至于如何把這個放到上，我們放到后面一起說。背景最近接手公司的一個移動端項目，是通過 Rax 作為 dsl 開發(fā)的，在發(fā)布的時候構(gòu)建多分代碼，在 APP 端編譯為能夠運行在 weex 上的代碼，在 H5（跑在瀏覽器或者 webview 里面...

Hydrogen 2019-08-26 10:56 評論0 收藏0