React Native

React Native 中因为无法使用 CSS 本身。

基于 SACSS 核心的命名规则，我们有另外一个 NPM 包供大家使用。

$ npm i @sacss/react-native

使用

import React from 'react';

import {Text, View, ImageBackground, Image} from '@sacss/react-native';

import mImg1 from "./assets/1.jpg";

import mImg2 from "./assets/2.jpg";

export default function App() {

return (

<View bc="#f5f5f5" pt={100} ph={30} h="100%">

<View mb={16} aic>

<Image br={32} w={64} h={64} source={mImg1}/>

</View>

<Text c="#ffffff" p={16} bc="#4c5fe2" tac mb={16}>Hello world!</Text>

<ImageBackground source={mImg2} mb={40}>

<View bc="rgba(255,255,255,.8)">

<Text fs={40} lh={100} tac fwb c="#4c5fe2">Hello Again!</Text>

</View>

</ImageBackground>

</View>

);

};

@sacss/react-native 和 SACSS 命名规则基本一致，只是换成了更加灵活的 key={value} 形式，点我查看更多。