react navigation学习 朱雀 2022-03-20 11:10 147阅读 0赞 react native导航器 * 学习网址:[https://reactnavigation.org/docs/zh-Hans/getting-started.html][https_reactnavigation.org_docs_zh-Hans_getting-started.html] * 图标库地址:[https://oblador.github.io/react-native-vector-icons/][https_oblador.github.io_react-native-vector-icons] * 遇到的问题: underfined is not an object (evaluating 'RNGestureHandlerModule.State') null is not an object (evaluating 'RNGestureHandlerModule.State') ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3ODE1NTk2_size_16_color_FFFFFF_t_70][] 或者 ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3ODE1NTk2_size_16_color_FFFFFF_t_70 1][] 1. delete node\_modules and package-lock.json 2. npm install 3. npm install --save react-navigation 4. npm install --save react-native-gesture-handler 5. react-native link ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3ODE1NTk2_size_16_color_FFFFFF_t_70 2][] 解决办法如链接:[https://stackoverflow.com/questions/53367195/invariant-violation-the-navigation-prop-is-missing-for-this-navigator][https_stackoverflow.com_questions_53367195_invariant-violation-the-navigation-prop-is-missing-for-this-navigator] * demo1:创建一个 stack navigator 效果图如右图所示![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3ODE1NTk2_size_16_color_FFFFFF_t_70 3][]点击按钮go Details Screen后跳转新页面![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3ODE1NTk2_size_16_color_FFFFFF_t_70 4][] 项目文件夹如右图所示:![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3ODE1NTk2_size_16_color_FFFFFF_t_70 5][] 1.新建一个文件夹src,在src内新建config和screens文件夹,config内新建route.js文件用来放置配置代码,screens内放置页面代码 App.js import React, { Component } from 'react'; import Route from './src/config/route' class App extends Component { render() { return ( <Route /> ); } } export default App route.js import { createStackNavigator,createAppContainer } from "react-navigation"; import React from 'react'; // 引入页面组件 import Home from '../screens/Home' import Details from '../screens/Details' // 配置路由 const AppNavigator = createStackNavigator({ Home: Home, Details: Details }); const Route = createAppContainer(AppNavigator); export default Route; Home.js import React, { Component } from 'react'; import { View, Text, Button } from 'react-native'; const styles = { container: { flex: 1, justifyContent: 'center', alignItems: 'center' } } class Home extends Component { static navigationOptions = { // 设置 title title: "首页" }; render() { return ( <View style={styles.container}> <Text>Home Screen</Text> <Button title="go Details Screen" // 路由跳转 onPress={() => this.props.navigation.push("Details")} /> </View> ); } } export default Home Details.js import React, { Component } from 'react'; import { View, Text, Button } from 'react-native'; const styles = { container: { flex: 1, justifyContent: 'center', alignItems: 'center' } } class Details extends Component { render() { return ( <View style={styles.container}> <Text>Details Screen</Text> <Button title="Go to Home" onPress={() => this.props.navigation.navigate('Home')} /> <Button title="Go back" onPress={() => this.props.navigation.goBack()} /> </View> ); } } export default Details 由上面的代码可知: 如果你处在堆栈深处,上面有多个页面,此时你想要将上面所有的页面都销毁,并返回第一个页面。 在这种情况下,要回到\` Home \`,可以使用\` navigate('Home') \`(而不是\` push \`! 尝试一下,看看有什么不同)。 另一个选择是\` navigation.popToTop() \`,它可以返回到堆栈中的第一个页面。 每次调用 \` push \` 时, 我们会向导航堆栈中添加新路由。 当你调用 \` navigate \` 时, 它首先尝试查找具有该名称的现有路由, 并且只有在堆栈上没有一个新路由时才会推送该路由。 this.props.navigation.goBack()实现返回 * 将上述代码在android上运行时,遇到如下问题Could not connect to development server ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3ODE1NTk2_size_16_color_FFFFFF_t_70 6][] 解决方法,利用Android Studio打开当前项目的MainActivity.java文件,进行如下修改 在合适位置加上下面两段代码: import com.facebook.react.ReactActivityDelegate; import com.facebook.react.ReactRootView; import com.swmansion.gesturehandler.react.RNGestureHandlerEnabledRootView; @Override protected ReactActivityDelegate createReactActivityDelegate() { return new ReactActivityDelegate(this, getMainComponentName()) { @Override protected ReactRootView createRootView() { return new RNGestureHandlerEnabledRootView(MainActivity.this); } }; } 完整代码示例 package com.awesomeproject; import com.facebook.react.ReactActivity; import com.facebook.react.ReactActivityDelegate; import com.facebook.react.ReactRootView; import com.swmansion.gesturehandler.react.RNGestureHandlerEnabledRootView; public class MainActivity extends ReactActivity { /** * Returns the name of the main component registered from JavaScript. * This is used to schedule rendering of the component. */ @Override protected String getMainComponentName() { return "AwesomeProject"; } @Override protected ReactActivityDelegate createReactActivityDelegate() { return new ReactActivityDelegate(this, getMainComponentName()) { @Override protected ReactRootView createRootView() { return new RNGestureHandlerEnabledRootView(MainActivity.this); } }; } } 上述问题成功解决![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3ODE1NTk2_size_16_color_FFFFFF_t_70 7][] * demo2传递参数给路由 1.在路由中传递 => this.props.navigation.navigate("Details",{ itemId: 86, otherParam: 'anything you want here' 2.接受路由的两种方法 const itemId = this.props.navigation.getParam('itemId', 'NO-ID'); const otherParam = this.props.navigation.state.params.otherParam; 3. 3.1设置标题栏显示的标题 页面组件navigationOptions,title这个属性用于设置标题栏的标题 3.2在标题中使用参数 在navigationOptions中使用this.props会报错,应该用\{navigation> navigationOptions,screenProps\}的对象调用它,再通过<code> navigation.state.params从navigation中获取参数 3.3使用setParams更新navigationOptions <Button title="Update the title" onPress=\{() => this.props.navigation.setParams(\{title:'使用setParams更新navigationOptions'\})\} /> 3.4调整标题样式 定制标题样式时有三个关键属性:headerStyle、headerTintColor和headerTitleStyle。 headerStyle:一个应用于 header 的最外层 View 的 样式对象, 如果你设置 backgroundColor ,他就是header 的颜色。 headerTintColor:返回按钮和标题都使用这个属性作为它们的颜色。 headerTitleStyle:如果我们想为标题定制fontFamily,fontWeight和其他Text样式属性,我们可以用它来完成。 如下所示,在某个页面可以实现对title的样式设定 static navigationOptions = { // 设置 title title: "首页", headerStyle: { backgroundColor:'#010101', }, headerTintColor:'#fff', headerTintStyle:{ fontWeight:'bold' } }; 3.5跨页面共享通用的navigationOptions 设置每一个页面的title,只需要在配置文件route.js中设置 const AppNavigator = createStackNavigator({ Home: Home, Details: Details }, { initialRouteName: 'Home', defaultNavigationOptions: { headerStyle: { backgroundColor: '#010101', }, headerTintColor: '#fff', headerTitleStyle: { fontWeight: 'bold', }, }, } ); 4.完整代码(App.js如上所示,就不粘贴) route.js import { createStackNavigator,createAppContainer } from "react-navigation"; import React from 'react'; // 引入页面组件 import Home from '../screens/Home' import Details from '../screens/Details' // 配置路由 const AppNavigator = createStackNavigator({ Home: Home, Details: Details }, { initialRouteName: 'Home', defaultNavigationOptions: { headerStyle: { backgroundColor: '#010101', }, headerTintColor: '#fff', headerTitleStyle: { fontWeight: 'bold', }, }, // navigationOptions: { // tabBarLabel: 'Home!', // }, } ); const Route = createAppContainer(AppNavigator); export default Route; home页面内的组件:child.js路由跳转,props需要由父组件传入 import React, { Component } from 'react'; import { View, Text } from 'react-native'; import Ionicons from 'react-native-vector-icons/Ionicons'; class CityScreen extends Component { static navigationOptions = ({ navigation }) => { return { title: "选择城市", headerStyle: { backgroundColor:'#e75404' }, headerTintColor:'white' } }; render() { return ( <View> <Text>home页面内的组件</Text> <Ionicons name='ios-add' size={26} style={WeatherInfoStyle.add_icon} onPress={() => this.props.navigation.navigate("Details",{ itemId: 86 })}/> </View> ); } } export default CityScreen Home.js import React, { Component } from 'react'; import { View, Text, Button, Image } from 'react-native'; import Child from "./child" class LogoTitle extends Component { render() { return ( <View style={ {flexDirection: 'row',justifyContent: 'flex-start',alignItems: 'flex-start'}}> <Image source={require('../img/preview.jpg')} style={ { width: 30, height: 30 }} /> </View> ); } } class Home extends Component { static navigationOptions = { // 设置 title // title: "首页", headerTitle: "首页", headerLeft: <LogoTitle />, headerRight: ( <Button onPress={() => alert('This is a button!')} title="Info" color="#fff" /> ), // 设置 title 样式 // headerStyle: { // backgroundColor:'#010101', // }, // headerTintColor:'#fff', // headerTintStyle:{ // fontWeight:'bold' // } }; render() { return ( <View> <Text>Home Screen</Text> <Button title="go Details Screen" // 路由跳转 onPress={() => this.props.navigation.navigate("Details",{ itemId: 86, title: 'Detail Page', otherParam: 'other' })} /> <Child {...this.props}/> </View> ); } } export default Home Details.js import React, { Component } from 'react'; import { View, Text, Button } from 'react-native'; class Details extends Component { static navigationOptions = ({ navigation }) => { return { // 在标题中使用参数 // title: navigation.getParam('title', 'Details Screen title'), title: navigation.state.params.title, headerRight: ( <Button onPress={() =>navigation.goBack()} title="return home" color="#fff" /> ), } }; render() { const itemId = this.props.navigation.getParam('itemId', 'NO-ID'); const otherParam = this.props.navigation.state.params.otherParam; return ( <View> <Text>Details Screen</Text> <Button title="Go to Home" onPress={() => this.props.navigation.navigate('Home')} /> <Button title="Go back" onPress={() => this.props.navigation.goBack()} /> <Button title="Update the title" onPress={() => this.props.navigation.setParams({title:'使用setParams更新navigationOptions'})} /> <Text>查看传参-----itemId:{itemId},otherParam:{otherParam}</Text> </View> ); } } export default Details * demo3创建一个Tab navigation,文件结构如demo1 一、createBottomTabNavigator ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3ODE1NTk2_size_16_color_FFFFFF_t_70 8][] 1.route.js import { createBottomTabNavigator,createAppContainer } from 'react-navigation'; import React from 'react'; import Tabnavigation1 from '../screens/Tabnavigation1' import Tabnavigation2 from '../screens/Tabnavigation2' // 配置路由 const AppNavigator = createBottomTabNavigator({ Tab1: Tabnavigation1, Tab2: Tabnavigation2 } ); const TabRoute = createAppContainer(AppNavigator); export default TabRoute; Tabnavigation1,Tabnavigation2目前代码类似,最简单的显示 import React, { Component } from 'react'; import { View, Text } from 'react-native'; const styles = { container: { flex: 1, justifyContent: 'center', alignItems: 'center' } } class Tabnavigation1 extends Component { render() { return ( <View style={styles.container}> <Text>Tabnavigation1</Text> </View> ); } } export default Tabnavigation1 二、自定义样式 图标库地址:[https://oblador.github.io/react-native-vector-icons/][https_oblador.github.io_react-native-vector-icons] 出现报错:Warning: Failed prop type: Invalid prop \`name\` of value \`ios-home-outline\` supplied to \`Icon\` ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3ODE1NTk2_size_16_color_FFFFFF_t_70 9][] 因为ios-home-outline,ios-person-outline图标不包括在图标库内 ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3ODE1NTk2_size_16_color_FFFFFF_t_70 10][] ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3ODE1NTk2_size_16_color_FFFFFF_t_70 11][] 1.route.js import { createBottomTabNavigator, createAppContainer } from 'react-navigation'; import Tabnavigation1 from '../screens/Tabnavigation1' import Tabnavigation2 from '../screens/Tabnavigation2' import Ionicons from 'react-native-vector-icons/Ionicons'; import React from 'react'; // 配置路由 const AppNavigator = createBottomTabNavigator( { Tab1: { screen: Tabnavigation1, navigationOptions: { tabBarLabel: "Home Page", tabBarIcon: ({ tintColor, focused }) => ( <Ionicons name={focused ? 'ios-home' : 'ios-open'} size={26} style={ { color: tintColor }} /> ), }, }, Tab2: { screen: Tabnavigation2, navigationOptions: { tabBarLabel: 'Profile', tabBarIcon: ({ tintColor, focused }) => ( <Ionicons name={focused ? 'ios-person' : 'ios-options'} size={26} style={ { color: tintColor }} /> ), }, }, }, { tabBarOptions: { // activeTintColor: '#e91e63', labelStyle: { fontSize: 12, }, // style: { // backgroundColor: 'blue', // }, headerTitle: { fontSize: '20', color: 'white', fontWeight: '500' }, activeTintColor: 'tomato', inactiveTintColor: 'gray', } } ); const TabRoute = createAppContainer(AppNavigator); export default TabRoute; Tabnavigation1,Tabnavigation2如上所示 * demo4创建一个Drawer navigation,文件结构如demo1 一、createBottomTabNavigator ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3ODE1NTk2_size_16_color_FFFFFF_t_70 12][] ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3ODE1NTk2_size_16_color_FFFFFF_t_70 13][] 1.route.js import { createDrawerNavigator,createAppContainer } from 'react-navigation'; import Drawer1 from '../screens/Drawer1' import Drawer2 from '../screens/Drawer2' // 配置路由 const AppNavigator = createDrawerNavigator({ Drawer1: Drawer1, Drawer2: Drawer2 } ); const DrawerRoute = createAppContainer(AppNavigator); export default DrawerRoute; Drawer1,Drawer2目前代码类似,最简单的显示 import React, { Component } from 'react'; import { View, Text, Button } from 'react-native'; const styles = { container: { flex: 1, justifyContent: 'center', alignItems: 'center' } } class Drawer1 extends Component { render() { return ( <View style={styles.container}> <Text>Drawer1</Text> <Button title="openDrawer" onPress={() => this.props.navigation.openDrawer()} /> <Button title="closeDrawer" onPress={() => this.props.navigation.closeDrawer()} /> </View> ); } } export default Drawer1 * demo5创建一个简单的StackNavigator和BottomTabNavigator结合体,文件结构如demo1,其他相关文件见demo1和demo3 ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3ODE1NTk2_size_16_color_FFFFFF_t_70 14][] route.js import { createBottomTabNavigator, createStackNavigator, createAppContainer } from "react-navigation"; import React from 'react'; // 引入页面组件 import Home from '../screens/home/Home' import Details from '../screens/Details' import Tabnavigation1 from '../screens/tab1/Tabnavigation1' import Tabnavigation2 from '../screens/tab2/Tabnavigation2' import Tabnavigation3 from '../screens/tab3/Tabnavigation3' import Ionicons from 'react-native-vector-icons/Ionicons'; // 配置路由 const HomeStack = createStackNavigator({ Home: Home, Details: Details }, { initialRouteName: 'Home', defaultNavigationOptions: { headerStyle: { backgroundColor: '#010101', }, headerTintColor: '#fff', headerTitleStyle: { fontWeight: 'bold', }, } } ); const Tab1Stack = createStackNavigator({ Tabnavigation1: Tabnavigation1 }, { defaultNavigationOptions: { headerStyle: { backgroundColor: '#010101', }, headerTintColor: '#fff', headerTitleStyle: { fontWeight: 'bold', }, } } ); const Tab2Stack = createStackNavigator({ Tabnavigation2: Tabnavigation2 }, { defaultNavigationOptions: { headerStyle: { backgroundColor: '#010101', }, headerTintColor: '#fff', headerTitleStyle: { fontWeight: 'bold', }, } } ); const Tab3Stack = createStackNavigator({ Tabnavigation3: Tabnavigation3 }, { defaultNavigationOptions: { headerStyle: { backgroundColor: '#010101', }, headerTintColor: '#fff', headerTitleStyle: { fontWeight: 'bold', }, } } ); const AppNavigator = createBottomTabNavigator( { HomeStack: { screen: HomeStack, navigationOptions: { tabBarLabel: "Alisa", tabBarIcon: ({ tintColor, focused }) => ( <Ionicons name={focused ? 'ios-chatbubbles' : 'ios-home'} size={26} style={ { color: tintColor }} /> ), }, }, Tab1Stack: { screen: Tab1Stack, navigationOptions: { tabBarLabel: '通讯录', tabBarIcon: ({ tintColor }) => ( <Ionicons name='ios-people' size={26} style={ { color: tintColor }} /> ), }, }, Tab2Stack: { screen: Tab2Stack, navigationOptions: { tabBarLabel: '发现', tabBarIcon: ({ tintColor }) => ( <Ionicons name='ios-navigate' size={26} style={ { color: tintColor }} /> ), }, }, Tab3Stack: { screen: Tab3Stack, navigationOptions: { tabBarLabel: '我', tabBarIcon: ({ tintColor }) => ( <Ionicons name='ios-person' size={26} style={ { color: tintColor }} /> ), }, }, }, { tabBarOptions: { labelStyle: { fontSize: 12, }, headerTitle: { fontSize: '20', color: 'white', fontWeight: '500' }, activeTintColor: '#4dbe2d', inactiveTintColor: 'gray', } } ); const Route = createAppContainer(AppNavigator); export default Route; * 后期可以看看react-native-router-flux 这个博客链接不错:[https://www.jianshu.com/p/37428d579cf6][https_www.jianshu.com_p_37428d579cf6] [https_reactnavigation.org_docs_zh-Hans_getting-started.html]: https://reactnavigation.org/docs/zh-Hans/getting-started.html [https_oblador.github.io_react-native-vector-icons]: https://oblador.github.io/react-native-vector-icons/ [watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3ODE1NTk2_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20190212155822342.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3ODE1NTk2,size_16,color_FFFFFF,t_70 [watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3ODE1NTk2_size_16_color_FFFFFF_t_70 1]: /images/20220320/1feba0c24b4d4a23a7f48c3084aeef34.png [watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3ODE1NTk2_size_16_color_FFFFFF_t_70 2]: /images/20220320/87690b717af946209bf53536e05eea0f.png [https_stackoverflow.com_questions_53367195_invariant-violation-the-navigation-prop-is-missing-for-this-navigator]: https://stackoverflow.com/questions/53367195/invariant-violation-the-navigation-prop-is-missing-for-this-navigator [watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3ODE1NTk2_size_16_color_FFFFFF_t_70 3]: https://img-blog.csdnimg.cn/20190212162319674.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3ODE1NTk2,size_16,color_FFFFFF,t_70 [watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3ODE1NTk2_size_16_color_FFFFFF_t_70 4]: /images/20220320/13ec9bb4a474448d8a126a10f1ad8b01.png [watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3ODE1NTk2_size_16_color_FFFFFF_t_70 5]: /images/20220320/022e800a9b224bf6853aa499c780b861.png [watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3ODE1NTk2_size_16_color_FFFFFF_t_70 6]: /images/20220320/753bddc28b6f4738a60645c3b6c40b23.png [watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3ODE1NTk2_size_16_color_FFFFFF_t_70 7]: /images/20220320/3eae65e4158f45cca254f83b7757c0dd.png [watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3ODE1NTk2_size_16_color_FFFFFF_t_70 8]: /images/20220320/1b13db58e4a5449faba1c03f377fcd0b.png [watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3ODE1NTk2_size_16_color_FFFFFF_t_70 9]: /images/20220320/cde9faeaf9994e9fb2cece1d652f569b.png [watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3ODE1NTk2_size_16_color_FFFFFF_t_70 10]: https://img-blog.csdnimg.cn/20190226155319745.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3ODE1NTk2,size_16,color_FFFFFF,t_70 [watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3ODE1NTk2_size_16_color_FFFFFF_t_70 11]: /images/20220320/69091769dbbf4437b1f1970f8019045e.png [watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3ODE1NTk2_size_16_color_FFFFFF_t_70 12]: https://img-blog.csdnimg.cn/20190225125752490.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3ODE1NTk2,size_16,color_FFFFFF,t_70 [watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3ODE1NTk2_size_16_color_FFFFFF_t_70 13]: /images/20220320/5899c058a86a4d3fab4a2d58efd854b9.png [watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM3ODE1NTk2_size_16_color_FFFFFF_t_70 14]: /images/20220320/8c0ad3d51eeb4f91ba91140c16fe0554.png [https_www.jianshu.com_p_37428d579cf6]: https://www.jianshu.com/p/37428d579cf6
还没有评论,来说两句吧...