传奇开心果编程

第十篇【传奇开心果系列】Ant Design Mobile of React 开发移动应用：涉及到的相关基础知识介绍和示例

传奇开心果博文系列

文章目录
- Ant Design Mobile of React 开发移动应用示例博文系列
- - 第一篇【传奇开心果系列】Ant Design Mobile of React 开发移动应用:从helloworld开始
  - 第二篇【传奇开心果系列】Ant Design Mobile of React 开发移动应用:天气应用
  - 第三篇【传奇开心果系列】Ant Design Mobile of React 开发移动应用:健身追踪
  - 第四篇【传奇开心果系列】Ant Design Mobile of React 开发移动应用：数据存储的七种类型讲解和示例
  - 第五篇【传奇开心果系列】Ant Design Mobile of React 开发移动应用：基础页面制作介绍和示例代码
  - 第六篇【传奇开心果系列】Ant Design Mobile of React 开发移动应用：UI框架39个组件集中讲解和示例代码
  - 第七篇【传奇开心果系列】Ant Design Mobile of React 开发移动应用：安装配置node和npm避坑攻略
  - 第八篇【传奇开心果系列】Ant Design Mobile of React 开发移动应用：打包上架部署云服务托管等后期工作
  - 第九篇【传奇开心果系列】Ant Design Mobile of React 开发移动应用：使用内置组件实现响应式设计
  - 第十篇【传奇开心果系列】Ant Design Mobile of React 开发移动应用：涉及到的相关基础知识介绍和示例
  - - 前言
    - 一、会用到React相关的基础知识
    - 二、会用到HTML、CSS和JavaScript基础知识
    - 三、会用到Ant Design Mobile组件相关基础知识
    - 四、会用到到响应式设计相关基础知识
    - 五、会用到使用移动开发工具来环境配置、管理项目依赖、构建和打包等相关基础知识
    - 六、会用到使用不同的方式与后端服务进行数据交互，例如使用RESTful API、Ajax等进行数据请求和响应处理相关基础知识
    - 七、会用到调试、测试、定位、解决应用中出现的问题和bug相关基础知识
    - 八、会用到性能优化提升应用的加载速度和用户体验相关基础知识

文章目录

Ant Design Mobile of React 开发移动应用示例博文系列

第一篇【传奇开心果系列】Ant Design Mobile of React 开发移动应用:从helloworld开始

第二篇【传奇开心果系列】Ant Design Mobile of React 开发移动应用:天气应用

第三篇【传奇开心果系列】Ant Design Mobile of React 开发移动应用:健身追踪

第四篇【传奇开心果系列】Ant Design Mobile of React 开发移动应用：数据存储的七种类型讲解和示例

第五篇【传奇开心果系列】Ant Design Mobile of React 开发移动应用：基础页面制作介绍和示例代码

第六篇【传奇开心果系列】Ant Design Mobile of React 开发移动应用：UI框架39个组件集中讲解和示例代码

第七篇【传奇开心果系列】Ant Design Mobile of React 开发移动应用：安装配置node和npm避坑攻略

第八篇【传奇开心果系列】Ant Design Mobile of React 开发移动应用：打包上架部署云服务托管等后期工作

第九篇【传奇开心果系列】Ant Design Mobile of React 开发移动应用：使用内置组件实现响应式设计

第十篇【传奇开心果系列】Ant Design Mobile of React 开发移动应用：涉及到的相关基础知识介绍和示例

前言

开发移动应用涉及到Ant Design Mobile时，您需要掌握以下相关方面的知识：

React框架：Ant Design Mobile是基于React框架的UI组件库，因此需要熟悉React的基本概念和使用方法，如组件、状态管理、生命周期等。
前端开发基础：了解HTML、CSS和JavaScript等前端基础知识，掌握DOM操作、样式布局和事件处理等技能。
Ant Design Mobile组件：详细了解Ant Design Mobile提供的各种移动端UI组件，包括按钮、表单、导航栏、列表等。理解这些组件的用法、属性和事件，能够正确地使用和定制它们来构建移动应用界面。
响应式设计：移动应用需要适配不同屏幕尺寸和设备，了解响应式设计的原理和实践，能够编写适应不同屏幕的布局和样式。
移动端开发工具：熟悉移动应用开发所使用的工具和环境，如Webpack、Babel等，能够配置和管理项目的依赖、构建和打包。
移动端网络通信：了解移动应用与后端服务之间的数据交互方式，如使用RESTful API、Ajax等进行数据请求和响应处理。
移动应用调试和测试：掌握移动应用调试和测试的方法和工具，能够定位和解决移动应用中出现的问题和bug。
移动端性能优化：了解移动应用性能优化的基本原则和技巧，如减少HTTP请求、图片优化、代码压缩等，以提升应用的加载速度和用户体验。

以上是开发移动应用涉及到Ant Design Mobile时的一些基本知识要求。当然，具体的开发需求和项目情况可能会有所不同，您可能还需要深入学习其他相关知识来满足实际的开发需求。

一、会用到React相关的基础知识

1. 创建React组件示例代码：

import React from 'react';

const MyComponent = () => {
  return (
    
      Hello, Ant Design Mobile!
    
  );
};

export default MyComponent;

在上述示例代码中，我们使用import React from 'react';语句引入React库，然后创建了一个简单的函数式组件MyComponent。在组件中，使用JSX语法定义了一个包含标题的

元素，并在返回语句中返回该元素。

使用组件示例代码：

import React from 'react';
import ReactDOM from 'react-dom';
import MyComponent from './MyComponent';

ReactDOM.render(, document.getElementById('app'));

在上述示例代码中，我们使用import语句引入React和ReactDOM库，并导入了之前创建的MyComponent组件。然后，使用ReactDOM.render方法将MyComponent组件渲染到指定的DOM元素上，通过document.getElementById('app')获取到容器元素的引用。

使用props传递数据示例代码：

import React from 'react';

const Greeting = (props) => {
  return (
    
      Hello, {props.name}!
    
  );
};

export default Greeting;

在上述示例代码中，我们定义了一个名为Greeting的函数式组件，并通过参数props接收传递过来的数据。在组件中，使用props.name来获取传递的name属性，并在标题中显示出来。

使用状态管理示例代码：

import React, { useState } from 'react';

const Counter = () => {
  const [count, setCount] = useState(0);

  const increment = () => {
    setCount(count + 1);
  };

  return (
    
      Counter: {count}
      
    
  );
};

export default Counter;

在上述示例代码中，我们使用useState钩子函数来定义了一个状态变量count和一个更新该状态的函数setCount。在组件中，通过count来展示当前计数值，并通过点击按钮触发increment函数来增加计数值。

这些示例代码展示了在Ant Design Mobile开发中所用到的React相关的基础知识的应用。通过灵活运用这些知识，你可以构建出更加复杂、交互性更强的Ant Design Mobile前端应用程序。

二、会用到HTML、CSS和JavaScript基础知识

在Ant Design Mobile开发中，你会用到以下HTML、CSS和JavaScript基础知识。下面是一些示例代码来演示它们的应用：

1. HTML基础知识示例代码：

DOCTYPE html>
<html>
<head>
  <title>Ant Design Mobiletitle>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
head>
<body>
  <h1>Welcome to Ant Design Mobileh1>
  <div id="app">div>
body>
html>

在上述示例代码中，我们使用了HTML标签来创建一个简单的页面结构。通过</code>标签设置页面标题，<code><meta></code>标签设置字符编码和视口，<code><h1></code>标签创建一个标题，<code><div></code>标签创建一个容器用于渲染Ant Design Mobile组件。 <ol start="2"> <li>CSS基础知识示例代码：</li> </ol> <pre><code class="prism language-css">h1 { color: #ff0000; font-size: 24px; } #app { background-color: #f0f0f0; padding: 20px; } </code></pre> 在上述示例代码中，我们使用CSS样式来设置HTML元素的外观。通过选择器和属性值，我们可以设置标题的颜色和字体大小，设置容器的背景颜色和内边距。 <ol start="3"> <li>JavaScript基础知识示例代码：</li> </ol> <pre><code class="prism language-javascript">import React from 'react'; import ReactDOM from 'react-dom'; import { Button } from 'antd-mobile'; const App = () => { const handleClick = () => { alert('Hello, Ant Design Mobile!'); }; return ( <div> <h1>Welcome to Ant Design Mobile</h1> <Button type="primary" onClick={handleClick}>Click Me</Button> </div> ); }; ReactDOM.render(<App />, document.getElementById('app')); </code></pre> 在上述示例代码中，我们使用JavaScript来创建一个React组件。通过导入React和ReactDOM库，我们可以使用JSX语法创建组件，并使用Ant Design Mobile的Button组件。定义了一个点击事件处理函数，在点击按钮时弹出一个提示框。最后，使用ReactDOM.render将组件渲染到指定的DOM元素上。 这些示例代码展示了在Ant Design Mobile开发中所用到的HTML、CSS和JavaScript基础知识的应用。通过灵活运用这些知识，你可以构建出更加丰富、交互性更强的Ant Design Mobile前端应用程序。 <h5>三、会用到Ant Design Mobile组件相关基础知识</h5> 在Ant Design Mobile开发中，你会用到一些Ant Design Mobile组件相关的基础知识。下面是一些示例代码来演示它们的应用： <a href="http://img.e-com-net.com/image/info8/7c5daea695204cabab121dbbbb7f504e.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/7c5daea695204cabab121dbbbb7f504e.jpg" alt="第十篇【传奇开心果系列】Ant Design Mobile of React 开发移动应用：涉及到的相关基础知识介绍和示例_第3张图片" width="650" height="571" style="border:1px solid black;"></a>1. Button按钮组件示例代码： <pre><code class="prism language-jsx">import React from 'react'; import { Button } from 'antd-mobile'; const MyButton = () => { const handleClick = () => { alert('Button clicked!'); }; return ( <Button type="primary" onClick={handleClick}>Click Me</Button> ); }; export default MyButton; </code></pre> 在上述示例代码中，我们使用<code>import { Button } from 'antd-mobile';</code>语句引入Ant Design Mobile的Button组件。然后，我们创建了一个自定义的函数式组件<code>MyButton</code>，在组件中使用<code><Button></code>标签来创建一个按钮，并通过<code>type="primary"</code>属性设置按钮样式为主要按钮。同时，我们定义了一个点击事件处理函数<code>handleClick</code>，当按钮被点击时弹出一个提示框。 <ol start="2"> <li>List列表组件示例代码：</li> </ol> <pre><code class="prism language-jsx">import React from 'react'; import { List } from 'antd-mobile'; const MyList = () => { return ( <List> <List.Item>Item 1</List.Item> <List.Item>Item 2</List.Item> <List.Item>Item 3</List.Item> </List> ); }; export default MyList; </code></pre> 在上述示例代码中，我们使用<code>import { List } from 'antd-mobile';</code>语句引入Ant Design Mobile的List组件。然后，我们创建了一个自定义的函数式组件<code>MyList</code>，在组件中使用<code><List></code>标签来创建一个列表，并在列表中使用多个<code><List.Item></code>标签来创建列表项。 <ol start="3"> <li>Flex弹性布局组件示例代码：</li> </ol> <pre><code class="prism language-jsx">import React from 'react'; import { Flex } from 'antd-mobile'; const MyFlex = () => { return ( <Flex> <Flex.Item>Item 1</Flex.Item> <Flex.Item>Item 2</Flex.Item> <Flex.Item>Item 3</Flex.Item> </Flex> ); }; export default MyFlex; </code></pre> 在上述示例代码中，我们使用<code>import { Flex } from 'antd-mobile';</code>语句引入Ant Design Mobile的Flex组件。然后，我们创建了一个自定义的函数式组件<code>MyFlex</code>，在组件中使用<code><Flex></code>标签来创建一个弹性布局容器，并在容器中使用多个<code><Flex.Item></code>标签来创建布局项。 这些示例代码展示了在Ant Design Mobile开发中所用到的一些组件相关的基础知识的应用。通过灵活运用这些知识，你可以构建出更加丰富、交互性更强的Ant Design Mobile前端应用程序。 <h5>四、会用到到响应式设计相关基础知识</h5> 在开发Ant Design Mobile应用程序时，你会用到一些响应式设计相关的基础知识。以下是一些示例代码，演示了这些知识的应用： <a href="http://img.e-com-net.com/image/info8/96f2435f85b8488c8b5ae95a0fc44923.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/96f2435f85b8488c8b5ae95a0fc44923.jpg" alt="第十篇【传奇开心果系列】Ant Design Mobile of React 开发移动应用：涉及到的相关基础知识介绍和示例_第4张图片" width="650" height="366" style="border:1px solid black;"></a>1. 使用媒体查询示例代码： <pre><code class="prism language-css">.container { display: flex; flex-wrap: wrap; } .item { width: 100%; } @media screen and (min-width: 768px) { .item { width: 50%; } } @media screen and (min-width: 1200px) { .item { width: 33.33%; } } </code></pre> 在上述示例代码中，我们使用CSS的媒体查询来实现响应式布局。在默认情况下，<code>.item</code>元素的宽度设置为100%。当屏幕宽度达到768px时，媒体查询将应用，<code>.item</code>元素的宽度设置为50%。当屏幕宽度达到1200px时，另一个媒体查询将应用，<code>.item</code>元素的宽度设置为33.33%。通过这种方式，我们可以根据不同的屏幕尺寸设置不同的样式，实现响应式布局。 <ol start="2"> <li>使用Flex布局示例代码：</li> </ol> <pre><code class="prism language-jsx">import React from 'react'; import { Flex } from 'antd-mobile'; const MyComponent = () => { return ( <Flex wrap="wrap" justify="center" align="center"> <Flex.Item>Item 1</Flex.Item> <Flex.Item>Item 2</Flex.Item> <Flex.Item>Item 3</Flex.Item> </Flex> ); }; export default MyComponent; </code></pre> 在上述示例代码中，我们使用Ant Design Mobile的Flex组件来实现响应式布局。通过设置<code>wrap="wrap"</code>属性，当需要换行时，元素将自动换行。通过设置<code>justify="center"</code>属性，元素在主轴上居中对齐。通过设置<code>align="center"</code>属性，元素在交叉轴上居中对齐。这样，无论屏幕尺寸如何变化，元素都能够自适应地排列和对齐。 <ol start="3"> <li>使用Grid网格布局示例代码：</li> </ol> <pre><code class="prism language-jsx">import React from 'react'; import { Grid } from 'antd-mobile'; const MyComponent = () => { const data = Array.from({ length: 6 }).map((_, index) => ({ icon: `icon-${index}`, text: `Item ${index + 1}`, })); return ( <Grid data={data} columnNum={3} /> ); }; export default MyComponent; </code></pre> 在上述示例代码中，我们使用Ant Design Mobile的Grid组件来实现响应式网格布局。通过传递一个数据数组给<code>data</code>属性，我们可以自动生成网格项。通过设置<code>columnNum={3}</code>属性，每行显示3列。这样，不论屏幕尺寸如何变化，网格布局都能够自适应地展示。 这些示例代码展示了在Ant Design Mobile开发中所用到的一些响应式设计相关的基础知识的应用。通过灵活运用这些知识，你可以构建出适应不同屏幕尺寸和设备的响应式Ant Design Mobile前端应用程序。 <h5>五、会用到使用移动开发工具来环境配置、管理项目依赖、构建和打包等相关基础知识</h5> 在移动应用开发中，你会用到一些工具和环境来配置和管理项目的依赖、构建和打包。以下是一些基础知识示例代码，演示了这些工具的应用： <a href="http://img.e-com-net.com/image/info8/a4ed6dc5fbed45d1b48bca405a272b0d.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/a4ed6dc5fbed45d1b48bca405a272b0d.jpg" alt="第十篇【传奇开心果系列】Ant Design Mobile of React 开发移动应用：涉及到的相关基础知识介绍和示例_第5张图片" width="650" height="338" style="border:1px solid black;"></a>1. 使用Webpack进行项目构建示例代码： 首先，确保已经全局安装了Webpack和Webpack CLI： <pre><code class="prism language-bash">npm install -g webpack webpack-cli </code></pre> 然后，在项目根目录下创建一个<code>webpack.config.js</code>文件，配置Webpack的相关设置： <pre><code class="prism language-javascript">const path = require('path'); module.exports = { entry: './src/index.js', output: { path: path.resolve(__dirname, 'dist'), filename: 'bundle.js', }, module: { rules: [ { test: /\.(js|jsx)$/, exclude: /node_modules/, use: ['babel-loader'], }, { test: /\.css$/, use: ['style-loader', 'css-loader'], }, ], }, resolve: { extensions: ['.js', '.jsx'], }, }; </code></pre> 在上述示例代码中，我们配置了Webpack的入口文件和输出文件路径。同时，我们使用<code>module.rules</code>配置了Babel和CSS加载器，以便处理JavaScript和CSS文件。最后，使用<code>resolve.extensions</code>配置了可以省略的文件扩展名。 <a href="http://img.e-com-net.com/image/info8/a33ac547b6e346e8a60744aa50262128.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/a33ac547b6e346e8a60744aa50262128.jpg" alt="第十篇【传奇开心果系列】Ant Design Mobile of React 开发移动应用：涉及到的相关基础知识介绍和示例_第6张图片" width="650" height="325" style="border:1px solid black;"></a>2. 使用Babel进行JavaScript代码转换示例代码： 首先，确保已经安装了Babel和相关插件： <pre><code class="prism language-bash">npm install --save-dev @babel/core @babel/preset-env babel-loader </code></pre> 然后，在Webpack配置文件中添加对Babel的配置： <pre><code class="prism language-javascript">module: { rules: [ { test: /\.(js|jsx)$/, exclude: /node_modules/, use: ['babel-loader'], }, ], }, </code></pre> 在项目根目录下创建一个<code>.babelrc</code>文件，配置Babel的预设： <pre><code class="prism language-json">{ "presets": ["@babel/preset-env"] } </code></pre> 这样，Webpack将会使用Babel加载器来处理JavaScript文件，通过Babel的预设将ES6+代码转换为浏览器可兼容的代码。 <ol start="3"> <li>使用npm进行依赖管理示例代码：</li> </ol> 在项目根目录下的<code>package.json</code>文件中，可以添加和管理项目的依赖： <pre><code class="prism language-json">{ "name": "my-app", "version": "1.0.0", "dependencies": { "react": "^17.0.1", "react-dom": "^17.0.1" }, "devDependencies": { "webpack": "^5.10.0", "webpack-cli": "^4.2.0", "babel-loader": "^8.2.2", "@babel/core": "^7.12.3", "@babel/preset-env": "^7.12.1" } } </code></pre> 在上述示例代码中，我们可以在<code>dependencies</code>中添加生产环境依赖，例如React和ReactDOM。在<code>devDependencies</code>中添加开发环境依赖，例如Webpack、Webpack CLI、Babel Loader和Babel相关插件。通过运行<code>npm install</code>命令，可以安装并管理项目的依赖。 这些示例代码展示了在移动端开发中所用到的一些工具和环境的基础知识的应用。通过灵活运用这些工具，你可以配置和管理项目的依赖、构建和打包，以满足移动应用开发的需求。 <h5>六、会用到使用不同的方式与后端服务进行数据交互，例如使用RESTful API、Ajax等进行数据请求和响应处理相关基础知识</h5> 在移动应用开发中，你会使用不同的方式与后端服务进行数据交互，例如使用RESTful API、Ajax等进行数据请求和响应处理。以下是一些基础知识示例代码，演示了这些数据交互方式的应用： <a href="http://img.e-com-net.com/image/info8/db7e218a5af34503a8d6600424a53bf3.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/db7e218a5af34503a8d6600424a53bf3.jpg" alt="第十篇【传奇开心果系列】Ant Design Mobile of React 开发移动应用：涉及到的相关基础知识介绍和示例_第7张图片" width="650" height="304" style="border:1px solid black;"></a>1. 使用RESTful API进行数据请求示例代码： <pre><code class="prism language-javascript">import axios from 'axios'; // 发送GET请求 axios.get('/api/users') .then(response => { console.log(response.data); }) .catch(error => { console.error(error); }); // 发送POST请求 axios.post('/api/users', { name: 'John', age: 25 }) .then(response => { console.log(response.data); }) .catch(error => { console.error(error); }); </code></pre> 在上述示例代码中，我们使用axios库来发送HTTP请求。通过调用<code>axios.get</code>方法可以发送GET请求，传递请求的URL作为参数。通过调用<code>axios.post</code>方法可以发送POST请求，传递请求的URL和请求体作为参数。使用<code>.then</code>方法处理请求成功的响应，使用<code>.catch</code>方法处理请求失败的错误。 <a href="http://img.e-com-net.com/image/info8/0d6d164a5a434e29a452cabb334e6f5a.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/0d6d164a5a434e29a452cabb334e6f5a.jpg" alt="第十篇【传奇开心果系列】Ant Design Mobile of React 开发移动应用：涉及到的相关基础知识介绍和示例_第8张图片" width="650" height="361" style="border:1px solid black;"></a>2. 使用Ajax进行数据请求示例代码： <pre><code class="prism language-javascript">const xhr = new XMLHttpRequest(); xhr.open('GET', '/api/users', true); xhr.onreadystatechange = function () { if (xhr.readyState === XMLHttpRequest.DONE) { if (xhr.status === 200) { console.log(xhr.responseText); } else { console.error(xhr.statusText); } } }; xhr.send(); </code></pre> 在上述示例代码中，我们使用XMLHttpRequest对象来发送HTTP请求。通过调用<code>xhr.open</code>方法设置请求的方法、URL和异步标志。通过设置<code>xhr.onreadystatechange</code>事件处理函数来监听请求状态的变化。当请求状态变为<code>XMLHttpRequest.DONE</code>时，可以通过<code>xhr.status</code>获取响应的状态码，通过<code>xhr.responseText</code>获取响应的文本数据。 这些示例代码展示了在移动应用开发中所用到的一些数据交互方式的基础知识的应用。通过灵活运用这些方式，你可以与后端服务进行数据请求和响应处理，实现移动应用与后端服务之间的数据交互。 <h5>七、会用到调试、测试、定位、解决应用中出现的问题和bug相关基础知识</h5> 在移动应用开发中，调试和测试是非常重要的环节，可以帮助你定位和解决应用中出现的问题和bug。以下是一些基础知识示例代码，演示了一些常用的移动应用调试和测试方法和工具： <a href="http://img.e-com-net.com/image/info8/e9f4b9ee5dca474fb037491e40ca9b04.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/e9f4b9ee5dca474fb037491e40ca9b04.jpg" alt="第十篇【传奇开心果系列】Ant Design Mobile of React 开发移动应用：涉及到的相关基础知识介绍和示例_第9张图片" width="650" height="637" style="border:1px solid black;"></a>（一）使用Chrome开发者工具进行移动应用调试示例代码： 将移动设备连接到电脑上，并打开Chrome浏览器。 <ol> <li> 打开开发者工具：在Chrome浏览器中，按下<code>Ctrl + Shift + I</code>（Windows）或<code>Command + Option + I</code>（Mac）打开开发者工具。 </li> <li> 切换到移动设备模式：在开发者工具窗口的左上角，点击手机图标按钮，进入移动设备模式。 </li> <li> 选择移动设备：在开发者工具窗口的顶部，点击设备选择框，选择你要模拟的移动设备。 </li> <li> 调试移动应用：在开发者工具中，可以使用各种调试工具和功能，例如查看元素、调试JavaScript代码、监控网络请求等，来定位和解决移动应用中的问题和bug。 </li> </ol> <a href="http://img.e-com-net.com/image/info8/3ed7f1892fbc4acf95e8047e541280b7.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/3ed7f1892fbc4acf95e8047e541280b7.jpg" alt="第十篇【传奇开心果系列】Ant Design Mobile of React 开发移动应用：涉及到的相关基础知识介绍和示例_第10张图片" width="650" height="387" style="border:1px solid black;"></a>（二）使用移动端调试工具进行移动应用调试示例代码： 对于移动应用的调试，你可以使用一些专门的移动端调试工具，例如： <ul> <li> Android Studio：适用于Android应用的集成开发环境，提供了丰富的调试工具和功能，例如Logcat日志查看器、调试器等。 </li> <li> Xcode：适用于iOS应用的集成开发环境，提供了强大的调试工具和功能，例如调试器、Instruments性能分析器等。 </li> </ul> 通过使用这些移动端调试工具，你可以在真实设备或模拟器上进行应用调试，查看日志、检查变量、跟踪代码执行流程等，以便定位和解决移动应用中的问题和bug。 （三）使用单元测试和集成测试进行移动应用测试示例代码： 在移动应用开发中，你可以使用单元测试和集成测试来验证应用的各个部分是否按照预期工作。以下是一个基于Jest测试框架的单元测试示例代码： <pre><code class="prism language-javascript">// calculator.js export function add(a, b) { return a + b; } export function subtract(a, b) { return a - b; } </code></pre> <pre><code class="prism language-javascript">// calculator.test.js import { add, subtract } from './calculator'; test('add function should add two numbers correctly', () => { expect(add(2, 3)).toBe(5); }); test('subtract function should subtract two numbers correctly', () => { expect(subtract(5, 2)).toBe(3); }); </code></pre> 在上述示例代码中，我们定义了一个<code>calculator.js</code>文件，其中导出了<code>add</code>和<code>subtract</code>两个函数。然后，我们创建了一个<code>calculator.test.js</code>文件，在该文件中编写了针对<code>add</code>和<code>subtract</code>函数的单元测试。通过运行测试命令（例如<code>npm test</code>），可以执行这些测试并查看测试结果。 这些示例代码展示了在移动应用开发中所用到的一些调试和测试的基础知识的应用。通过灵活运用这些方法和工具，你可以定位和解决移动应用中出现的问题和bug，并确保应用的质量和稳定性。 <h5>八、会用到性能优化提升应用的加载速度和用户体验相关基础知识</h5> 在移动应用开发中，性能优化是非常重要的，可以提升应用的加载速度和用户体验。以下是一些基本原则和技巧，可以帮助你进行移动应用性能优化： <a href="http://img.e-com-net.com/image/info8/8d258c1a15f343bb81f8aba45c887022.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/8d258c1a15f343bb81f8aba45c887022.jpg" alt="第十篇【传奇开心果系列】Ant Design Mobile of React 开发移动应用：涉及到的相关基础知识介绍和示例_第11张图片" width="400" height="285" style="border:1px solid black;"></a>1. 减少HTTP请求： <ul> <li>合并文件：将多个CSS或JavaScript文件合并为一个，减少HTTP请求的数量。</li> <li>使用雪碧图：将多个小图标合并为一个大图，通过CSS的背景定位来显示不同的图标，减少HTTP请求的数量。</li> <li>使用字体图标：使用字体图标代替图像图标，减少HTTP请求的数量。</li> </ul> <ol start="2"> <li>图片优化：</li> </ol> <ul> <li>压缩图片：使用工具（例如ImageOptim、TinyPNG）压缩图片文件大小，减少下载时间。</li> <li>使用适当的图像格式：选择合适的图像格式，例如JPEG、PNG或WebP，以在图像质量和文件大小之间取得平衡。</li> </ul> <ol start="3"> <li>代码压缩和合并：</li> </ol> <ul> <li>压缩CSS和JavaScript代码：使用工具（例如UglifyJS、Terser）压缩代码文件大小，减少下载时间。</li> <li>合并CSS和JavaScript文件：将多个CSS或JavaScript文件合并为一个，减少HTTP请求的数量。</li> </ul> <a href="http://img.e-com-net.com/image/info8/321e263edc624a3b9d6507461f8148d1.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/321e263edc624a3b9d6507461f8148d1.jpg" alt="第十篇【传奇开心果系列】Ant Design Mobile of React 开发移动应用：涉及到的相关基础知识介绍和示例_第12张图片" width="337" height="299" style="border:1px solid black;"></a>4. 延迟加载和懒加载： <ul> <li>延迟加载：延迟加载某些资源，例如图片、JavaScript库，直到它们真正需要时再加载。</li> <li>懒加载：只在用户滚动到可见区域时加载特定的内容，例如图片或其他资源。</li> </ul> <ol start="5"> <li>缓存机制：</li> </ol> <ul> <li>使用浏览器缓存：通过设置适当的HTTP响应头来启用浏览器缓存，减少重复的网络请求。</li> <li>使用缓存策略：将不经常变化的资源（例如静态文件）设置为永久缓存，将动态内容设置为可缓存但有限时间的缓存。</li> </ul> <ol start="6"> <li>DOM操作和重绘优化：</li> </ol> <ul> <li>减少DOM操作：减少对DOM的频繁操作，因为DOM操作是昂贵的，会引起重排和重绘。</li> <li>使用CSS动画：使用CSS动画代替JavaScript动画，因为CSS动画通常更高效。</li> </ul> 这些是一些基本的移动应用性能优化原则和技巧。通过遵循这些原则和运用这些技巧，你可以提升移动应用的加载速度和用户体验，使应用更加高效和流畅。 </div> </div> </div> </div> </div>  <div id="SOHUCS" sid="1748554150322388992"></div> <script type="text/javascript" src="/views/front/js/chanyan.js"></script>  <div class="youdao-fixed-ad" id="detail_ad_bottom"></div> </div> <div class="col-md-3"> <div class="row" id="ad">  <div id="right-1" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_1"> </div> </div>  <div id="right-2" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_2"></div> </div>  <div id="right-3" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_3"></div> </div> </div> </div> </div> </div> </div> <div class="container"> <h4 class="pt20 mb15 mt0 border-top">你可能感兴趣的:(Ant,Design,Mobile,of,React,示例,react.js,javascript,前端框架,ui,node.js)</h4> <div id="paradigm-article-related"> <div class="recommend-post mb30"> <ul class="widget-links"> <li><a href="/article/1903816501836705792.htm" title="在SPSS中进行单因素方差分析（One-Way ANOVA）是一种常见的统计分析方法，用于比较三个或更多独立组之间的均值差异。" target="_blank">在SPSS中进行单因素方差分析（One-Way ANOVA）是一种常见的统计分析方法，用于比较三个或更多独立组之间的均值差异。</a> zhangfeng1133 <a class="tag" taget="_blank" href="/search/%E5%9D%87%E5%80%BC%E7%AE%97%E6%B3%95/1.htm">均值算法</a><a class="tag" taget="_blank" href="/search/%E7%AE%97%E6%B3%95/1.htm">算法</a> <div>在SPSS中进行单因素方差分析（One-WayANOVA）是一种常见的统计分析方法，用于比较三个或更多独立组之间的均值差异。以下是进行单因素方差分析的详细步骤：---###1.**数据准备**-**因变量**：需要分析的连续变量（如成绩、收入等）。-**自变量**：分类变量（如组别、性别等），通常是一个名义变量。数据结构示例：|组别（自变量）|成绩（因变量）||----------------|-</div> </li> <li><a href="/article/1903811584057208832.htm" title="Python画词云图，Python画圆形词云图，API详解" target="_blank">Python画词云图，Python画圆形词云图，API详解</a> 请一直在路上 <a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a> <div>在Python中，词云图的常用库是wordcloud。以下是核心API参数的详细讲解，以及一个完整的使用示例。一、参数类型默认值说明参数类型默认值说明widthint400词云图的宽度（像素）heightint200词云图的高度（像素）background_colorstr“black”背景颜色，可以是颜色名称（如“white”）或十六进制值（如“#FFFFFF”）colormapstr/matp</div> </li> <li><a href="/article/1903809437764743168.htm" title="前端性能优化-知识点" target="_blank">前端性能优化-知识点</a> 甲亿 <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E6%80%A7%E8%83%BD%E4%BC%98%E5%8C%96/1.htm">性能优化</a> <div>Web性能优化意义1.减少整体加载时间：减小文件体积、减少HTTP请求、使用预加载。2.使网站尽快可用：仅加载首屏内容，其他内容根据需要进行懒加载。3.平滑和交互性：使用CSS替代JS动画、减少UI重绘。4.加载表现形式：使用加载动画、进度条、骨架屏等过渡信息，让用户感觉到页面加载更快。5.性能监测：性能指标、性能测试、性能监控持续优化等Web性能指标RAIL性能模型Response(响应)：快速</div> </li> <li><a href="/article/1903809185175367680.htm" title="聊聊langchain4j的Naive RAG" target="_blank">聊聊langchain4j的Naive RAG</a> hello_ejb3 <a class="tag" taget="_blank" href="/search/%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD/1.htm">人工智能</a> <div>序本文主要研究一下langchain4j的NaiveRAG示例publicclassNaive_RAG_Example{/***ThisexampledemonstrateshowtoimplementanaiveRetrieval-AugmentedGeneration(RAG)application.*By"naive",wemeanthatwewon'tuseanyadvancedRAGte</div> </li> <li><a href="/article/1903808555442565120.htm" title="JavaScript 性能优化实战：优化循环结构提升效率" target="_blank">JavaScript 性能优化实战：优化循环结构提升效率</a> deying0865423 <a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a> <div>目录一、理解循环的性能损耗二、减少循环迭代次数（一）缓存数组长度（二）提前终止循环三、优化循环内部操作（一）避免在循环内执行复杂计算（二）减少DOM操作四、选择合适的循环类型（一）for循环与while循环的选择（二）for...in与for...of的使用场景在JavaScript编程中，循环结构是实现重复执行任务的基础工具。然而，不当的循环使用常常会导致性能瓶颈，特别是在处理大量数据时，循环的</div> </li> <li><a href="/article/1903807798819483648.htm" title="【最新】TensorFlow、cuDNN、CUDA三者之间的最新版本对应及下载地址" target="_blank">【最新】TensorFlow、cuDNN、CUDA三者之间的最新版本对应及下载地址</a> 江上_酒 <a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E7%8E%AF%E5%A2%83%E5%8F%8A%E5%B7%A5%E5%85%B7%E9%85%8D%E7%BD%AE/1.htm">开发环境及工具配置</a><a class="tag" taget="_blank" href="/search/TensorFlow/1.htm">TensorFlow</a><a class="tag" taget="_blank" href="/search/CUDA/1.htm">CUDA</a><a class="tag" taget="_blank" href="/search/cuDNN/1.htm">cuDNN</a> <div>TensorFlow、cuDNN、CUDA对应关系官网查询地址CUDA下载地址cuDNN下载地址VersionPythonversionCompilerBuildtoolscuDNNCUDAtensorflow_gpu-2.9.03.7-3.10MSVC2019Bazel5.0.08.111.2tensorflow_gpu-2.8.03.7-3.10MSVC2019Bazel4.2.18.111.</div> </li> <li><a href="/article/1903804775091204096.htm" title="【网络安全 | 漏洞挖掘】通过控制台调试实现登录" target="_blank">【网络安全 | 漏洞挖掘】通过控制台调试实现登录</a> 秋说 <a class="tag" taget="_blank" href="/search/web%E5%AE%89%E5%85%A8/1.htm">web安全</a><a class="tag" taget="_blank" href="/search/%E6%BC%8F%E6%B4%9E%E6%8C%96%E6%8E%98/1.htm">漏洞挖掘</a> <div>未经许可，不得转载。文章目录正文在安全测试过程中，我留意到一个特殊现象：当登录出现错误时，相关请求包并不经过BurpSuite。那么此时账号密码是储存在前端的，我通过调试即可实现登录管理员账户。正文由于系统设定，输入错误的账号和密码会弹出“账号密码错误”的提示。基于此，我在代码中“账号密码错误”提示的相关位置设置了断点，截图如下：随后，我刷新浏览器页面，输入错误的账号和密码，然后点击登录按钮，操作</div> </li> <li><a href="/article/1903802880863825920.htm" title="网络空间安全专业培养方案及学习建议" target="_blank">网络空间安全专业培养方案及学习建议</a> 菜根Sec <a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C%E5%AE%89%E5%85%A8/1.htm">网络安全</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C%E7%A9%BA%E9%97%B4%E5%AE%89%E5%85%A8/1.htm">网络空间安全</a><a class="tag" taget="_blank" href="/search/%E4%BF%A1%E6%81%AF%E5%AE%89%E5%85%A8/1.htm">信息安全</a><a class="tag" taget="_blank" href="/search/%E5%A4%A7%E5%AD%A6%E4%B8%93%E4%B8%9A/1.htm">大学专业</a> <div>一、网络空间安全专业培养方案（示例）本文以武汉大学网络空间安全专业培养方案为例，列举本科期间学习的课程。详情参见：https://cse.whu.edu.cn/rcpy/lxspy/zyjs/wlkjaqzypyfa.htm1、培养目标网络空间安全学科是综台计算机、通信、电子、数学、物理、生物、管理、法律和教育等学科，并发展演绎而形成的交叉学科。培养的本科生要求掌握网络空间安全学科的基本理论、基本</div> </li> <li><a href="/article/1903794558131564544.htm" title="vant官网-vant ui 首页-移动端Vue组件库" target="_blank">vant官网-vant ui 首页-移动端Vue组件库</a> embelfe_segge <a class="tag" taget="_blank" href="/search/%E9%9D%A2%E8%AF%95/1.htm">面试</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0%E8%B7%AF%E7%BA%BF/1.htm">学习路线</a><a class="tag" taget="_blank" href="/search/%E9%98%BF%E9%87%8C%E5%B7%B4%E5%B7%B4/1.htm">阿里巴巴</a><a class="tag" taget="_blank" href="/search/android/1.htm">android</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E5%90%8E%E7%AB%AF/1.htm">后端</a> <div>Vant是有赞前端团队开源的移动端vue组件库，适用于手机端h5页面。鉴于百度搜索不到vant官方网址，分享一下vant组件库官网地址，方便新手使用vant官网地址https://vant-contrib.gitee.io/vant/#/zh-CN/通过npm安装在现有项目中使用Vant时，可以通过npm或yarn进行安装：#Vue2项目，安装Vant2：npmivant-S#Vue3项目，安装V</div> </li> <li><a href="/article/1903794180006670336.htm" title="使用 NetworkX 进行图论分析与可视化" target="_blank">使用 NetworkX 进行图论分析与可视化</a> aiweker <a class="tag" taget="_blank" href="/search/%E8%B7%9F%E6%88%91%E5%AD%A6python/1.htm">跟我学python</a><a class="tag" taget="_blank" href="/search/%E5%9B%BE%E8%AE%BA/1.htm">图论</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a> <div>使用NetworkX进行图论分析与可视化NetworkX是一个用于创建、操作和研究复杂网络的Python库。它提供了丰富的图论算法和数据结构，适用于各种网络分析任务。本文将分点介绍NetworkX的主要功能，并通过代码示例进行详细说明。1.安装NetworkX在开始使用NetworkX之前，首先需要安装它。可以通过pip进行安装：pipinstallnetworkx2.创建图NetworkX支持多</div> </li> <li><a href="/article/1903790398606733312.htm" title="使用 UV 管理 Python 项目 | python小知识" target="_blank">使用 UV 管理 Python 项目 | python小知识</a> aiweker <a class="tag" taget="_blank" href="/search/%E8%B7%9F%E6%88%91%E5%AD%A6python/1.htm">跟我学python</a><a class="tag" taget="_blank" href="/search/uv/1.htm">uv</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD/1.htm">人工智能</a> <div>使用UV管理Python项目|python小知识1.引言在Python开发中，项目管理工具是必不可少的。常见的工具如pip、pipenv、poetry等，它们各有优缺点。近年来，uv作为一个新兴的Python项目管理工具，逐渐受到开发者的关注。uv旨在提供更快的依赖解析和安装速度，同时保持与现有工具的兼容性。本文将详细介绍uv的功能和应用场景，并通过代码示例展示其使用方法。最后，我们将对比uv与其</div> </li> <li><a href="/article/1903788508699488256.htm" title="可视化埋点在React Native中的实践" target="_blank">可视化埋点在React Native中的实践</a> Shopee技术团队 <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/react/1.htm">react</a><a class="tag" taget="_blank" href="/search/native/1.htm">native</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/react.js/1.htm">react.js</a> <div>本文首发于微信公众号“Shopee技术团队”。1.背景笔者所在团队为Shopee的本地生活前端团队，用户可以在我们的平台购买优惠券，然后去线下门店使用。随着用户规模不断增加，研究用户行为数据可以更好地指导产品功能设计，提供更加优秀的用户体验。用户行为数据的研究首先涉及到如何采集，即我们常说的“埋点”。一直以来，我们项目中的埋点都采用代码埋点，每次新增埋点往往是一些重复性的工作，且需要重新发布代码才</div> </li> <li><a href="/article/1903788381238784000.htm" title="去哪儿网 ReactNative 跨小程序多端方案介绍" target="_blank">去哪儿网 ReactNative 跨小程序多端方案介绍</a> 去哪儿网技术沙龙 <a class="tag" taget="_blank" href="/search/%E5%A4%A7%E5%89%8D%E7%AB%AF/1.htm">大前端</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/react/1.htm">react</a><a class="tag" taget="_blank" href="/search/native/1.htm">native</a><a class="tag" taget="_blank" href="/search/%E5%B0%8F%E7%A8%8B%E5%BA%8F/1.htm">小程序</a> <div>1前言qrn-remax-unir是由去哪儿网前端技术团队实现的一套将RN适配到小程序端的跨端组件，通过该组件库可快速方便的将RN源代码直接运行到小程序端。方案参考了react-native-web的适配方案，使用remax框架来实现适配组件库并达到适配多小程序的目的。和react-native-web一样，它对RN源代码侵入度低，并且调试和替换组件相当方便。方案来自于社区，我们只是合理的应用用来</div> </li> <li><a href="/article/1903788254876987392.htm" title="python Qt" target="_blank">python Qt</a> Solkatt's <div>最近帮朋友做了一个将文本文件按条件导出到excel里面的小程序。使用了PyQT，发现Python真是一门强大的脚本语言，开发效率极高。首先需要引用fromPyQt4importQtGui,uic,QtCore很多控件像QPushButton是从QtGui的空间中得来的，下面def__init__(self,parent=None)中定义了界面的设计及与控件相互联系的方法。classAddressB</div> </li> <li><a href="/article/1903783717093044224.htm" title="Android端ReactNative环境搭建——上" target="_blank">Android端ReactNative环境搭建——上</a> hzulwy <a class="tag" taget="_blank" href="/search/reactnative/1.htm">reactnative</a><a class="tag" taget="_blank" href="/search/react/1.htm">react</a><a class="tag" taget="_blank" href="/search/native/1.htm">native</a><a class="tag" taget="_blank" href="/search/android/1.htm">android</a><a class="tag" taget="_blank" href="/search/react.js/1.htm">react.js</a> <div>前言最近一年，因为公司业务需要，部门引入了rn这门跨段技术来开发业务需求。从去年部门大佬调研rn这个框架到现在已有超过一年的时间了。而我从当时毕业不到1年的小白成长到现在负责维护项目的Android端代码的主力。同时，自己对rn相关的技术有了不少理解。因此，想要分享一些知识点，希望可以帮助到大家。我会以一个专栏的方式述说在这一年当中使用rn开发需求遇到的困难。大家可以借鉴参考下，共同进步！！！使用</div> </li> <li><a href="/article/1903780435507343360.htm" title="React Native 迁移的阵痛" target="_blank">React Native 迁移的阵痛</a> Ethan. L <a class="tag" taget="_blank" href="/search/ReactNative/1.htm">ReactNative</a><a class="tag" taget="_blank" href="/search/%26amp%3B/1.htm">&</a><a class="tag" taget="_blank" href="/search/JS/1.htm">JS</a><a class="tag" taget="_blank" href="/search/react/1.htm">react</a><a class="tag" taget="_blank" href="/search/native/1.htm">native</a><a class="tag" taget="_blank" href="/search/react.js/1.htm">react.js</a><a class="tag" taget="_blank" href="/search/android/1.htm">android</a><a class="tag" taget="_blank" href="/search/ios/1.htm">ios</a> <div>背景由于我们的移动应用程序已经存在多年，经历了许多开发者的更替，因此变得越来越臃肿和难以维护。此外，我们团队中的Android开发人员一直很短缺，这导致我们在两个平台上的开发进度和质量存在巨大差异。因此，我们决定采用ReactNative技术，将原生工程迁移到该平台上，以提高应用程序的可维护性和整体性能。我在《ReactNative技术选型分析》中，阐述了对现有原生工程集成ReactNative的</div> </li> <li><a href="/article/1903780309283958784.htm" title="Android React Native应用逆向分析初探" target="_blank">Android React Native应用逆向分析初探</a> byc6352 <a class="tag" taget="_blank" href="/search/android/1.htm">android</a><a class="tag" taget="_blank" href="/search/android/1.htm">android</a> <div>随着移动互联网时代的到来，用户在移动设备上花费的时间越来越多，不仅是因为移动设备方便携带，而且还因为层出不穷的大量应用提供为用户使用，以往在电脑上才能做的事情，现在仅靠一部手机就可以解决了。当前的移动设备厂商很多，但是被广泛使用的主流系统却只有两个，Android和iOS，因此现在大多数应用都会有两个版本，Android版本和iOS版本。然而这两种应用的开发方式却完全不同，移动客户端开发人员不得不</div> </li> <li><a href="/article/1903780182876024832.htm" title="实时光线追踪技术：Ray Tracing_2024-07-21_02-55-16.Tex" target="_blank">实时光线追踪技术：Ray Tracing_2024-07-21_02-55-16.Tex</a> chenjj4003 <a class="tag" taget="_blank" href="/search/%E6%B8%B8%E6%88%8F%E5%BC%80%E5%8F%91/1.htm">游戏开发</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/%E7%AE%97%E6%B3%95/1.htm">算法</a><a class="tag" taget="_blank" href="/search/%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD/1.htm">人工智能</a><a class="tag" taget="_blank" href="/search/%E7%9F%A9%E9%98%B5/1.htm">矩阵</a><a class="tag" taget="_blank" href="/search/%E7%BA%BF%E6%80%A7%E4%BB%A3%E6%95%B0/1.htm">线性代数</a><a class="tag" taget="_blank" href="/search/%E9%AA%A8%E9%AA%BC%E7%BB%91%E5%AE%9A/1.htm">骨骼绑定</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a> <div>实时光线追踪技术：RayTracing实时光线追踪技术教程基础知识光线追踪原理光线追踪是一种渲染技术，它通过模拟光线在场景中的传播和反射来生成图像。在实时光线追踪中，这一过程被优化以在有限的时间内完成，通常用于游戏和实时动画。其核心原理是逆向追踪，即从观察者（摄像机）发出光线，而不是从光源发出，这样可以减少计算量。示例：光线追踪的基本算法#Python示例代码，展示如何计算光线与场景中物体的交点c</div> </li> <li><a href="/article/1903778668358987776.htm" title="PyQt和PySide的区别和比较" target="_blank">PyQt和PySide的区别和比较</a> PgosOcaml <a class="tag" taget="_blank" href="/search/pyqt/1.htm">pyqt</a><a class="tag" taget="_blank" href="/search/mfc/1.htm">mfc</a><a class="tag" taget="_blank" href="/search/c%2B%2B/1.htm">c++</a> <div>PyQt和PySide的区别和比较PyQt和PySide是两个用于创建图形用户界面(GUI)的Python库。它们都是基于Qt框架，Qt是一个跨平台的应用程序和UI开发框架。本文将介绍PyQt和PySide之间的区别和比较，并提供相应的源代码示例。开发者许可证：PyQt的开发者许可证是商业许可证，因此如果您想在商业项目中业项目中使用PyQt，您需要购买相应的许可证。而Py业项目中使用PyQt，您需</div> </li> <li><a href="/article/1903778667205554176.htm" title="Transposed convolution（2016 IEEE）" target="_blank">Transposed convolution（2016 IEEE）</a> 刘若里 <a class="tag" taget="_blank" href="/search/%E8%AE%BA%E6%96%87%E9%98%85%E8%AF%BB/1.htm">论文阅读</a><a class="tag" taget="_blank" href="/search/%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD/1.htm">人工智能</a><a class="tag" taget="_blank" href="/search/%E8%AE%A1%E7%AE%97%E6%9C%BA%E8%A7%86%E8%A7%89/1.htm">计算机视觉</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C/1.htm">网络</a><a class="tag" taget="_blank" href="/search/%E7%AC%94%E8%AE%B0/1.htm">笔记</a> <div>论文标题FullyConvolutionalNetworksforSemanticSegmentation论文作者EvanShelhamer,JonathanLong,TrevorDarrell发表日期2016年05月01日GB引用>ShelhamerEvan,LongJonathan,DarrellTrevor.FullyConvolutionalNetworksforSemanticSegme</div> </li> <li><a href="/article/1903777281562701824.htm" title="Node.js 包管理配置文件详解：package.json、npmrc、package-lock.json 全面解析" target="_blank">Node.js 包管理配置文件详解：package.json、npmrc、package-lock.json 全面解析</a> 还是鼠鼠 <a class="tag" taget="_blank" href="/search/node.js/1.htm">node.js</a><a class="tag" taget="_blank" href="/search/node.js/1.htm">node.js</a><a class="tag" taget="_blank" href="/search/json/1.htm">json</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/vscode/1.htm">vscode</a> <div>目录Node.js包管理配置文件详解1.package.json：Node.js项目的核心配置文件示例：完整的package.json配置关键字段解析2.package-lock.json：锁定依赖版本示例：部分package-lock.json作用如果package-lock.json出现问题3..npmrc：npm的自定义配置文件示例：修改npm源应用.npmrc配置4..nvmrc：Node</div> </li> <li><a href="/article/1903775762972995584.htm" title="第十七章:Future Directions_《C++ Templates》notes" target="_blank">第十七章:Future Directions_《C++ Templates》notes</a> 郭涤生 <a class="tag" taget="_blank" href="/search/c%2Fc%2B%2B/1.htm">c/c++</a><a class="tag" taget="_blank" href="/search/c%2B%2B/1.htm">c++</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a><a class="tag" taget="_blank" href="/search/%E7%AC%94%E8%AE%B0/1.htm">笔记</a> <div>FutureDirections核心重难点：示例代码：设计题多选题答案设计题详解核心重难点：泛型非类型模板参数允许任意类型作为非类型模板参数（如template）需解决类型推导和链接问题编译期控制流constexprif替代模板偏特化（减少代码膨胀）折叠表达式优化可变参数模板处理反射与元编程增强类型检查（is_convertible_v等）反射提案（如成员变量/函数查询）模块化支持解决传统头文件包</div> </li> <li><a href="/article/1903774124140982272.htm" title="520微信代码轰炸" target="_blank">520微信代码轰炸</a> wengkebiao <a class="tag" taget="_blank" href="/search/python/1.htm">python</a> <div>写一个脚本，在520那天发给你的小可爱。#-*-coding:utf-8-*-#@Time:2022/5/1913:36#@Author:wkbimporttime,osimportpyautogui,pypercliptime.sleep(5)foriinrange(10):#pyautogui.click(662,748)pyperclip.copy("代码轰炸：hahaha,第{0}次".f</div> </li> <li><a href="/article/1903767820668301312.htm" title="【重温设计模式】访问者模式及其Java示例" target="_blank">【重温设计模式】访问者模式及其Java示例</a> 万猫学社 <a class="tag" taget="_blank" href="/search/%E9%87%8D%E6%B8%A9%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F%E5%8F%8A%E5%85%B6Java%E5%AE%9E%E7%8E%B0/1.htm">重温设计模式及其Java实现</a><a class="tag" taget="_blank" href="/search/%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F/1.htm">设计模式</a><a class="tag" taget="_blank" href="/search/%E8%AE%BF%E9%97%AE%E8%80%85%E6%A8%A1%E5%BC%8F/1.htm">访问者模式</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div>访问者模式的基本概念访问者模式，一种行为型设计模式，其基本定义是：允许一个或者多个操作应用到一组对象上，解耦操作和对象的具体类，使得操作的添加可以独立于对象的类结构变化。在面向对象编程中，访问者模式的重要性不言而喻。它将数据操作和数据结构分离，使得在不改变数据结构的前提下，可以添加新的操作，从而增强了系统的灵活性和可扩展性。在访问者模式中，数据结构是稳定的，而操作是易变的。这就像一座博物馆，展品（</div> </li> <li><a href="/article/1903767251786461184.htm" title="鸿蒙5开发：Ark-TS UI 动效设计指南：让你的应用界面 “活” 起来" target="_blank">鸿蒙5开发：Ark-TS UI 动效设计指南：让你的应用界面 “活” 起来</a> <a class="tag" taget="_blank" href="/search/harmonyos-next/1.htm">harmonyos-next</a> <div>在鸿蒙5应用开发中，Ark-TSUI不仅能让你快速构建漂亮的界面，还提供了丰富的动效功能，让界面交互更加流畅和有趣。今天咱们聊聊Ark-TSUI的动效设计，看看如何用几行代码实现按钮点击动画、页面过渡效果等，让你的应用“眼前一亮”。一、Ark-TSUI动效的核心玩法：简单又强大Ark-TSUI的动效设计基于Animator类和内置的过渡效果，无需复杂的第三方库，就能实现多种动画效果。比如：按钮点击</div> </li> <li><a href="/article/1903766937905721344.htm" title="TicTacToe Module" target="_blank">TicTacToe Module</a> W_X_99515681 <a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a> <div>Homework2Releasev5.016/02/2025CONTENTS1TicTacToe12Contents32.1TicTacToeModule............................................32.2ReinforcementLearningPlayer.....................................62.3Require</div> </li> <li><a href="/article/1903759621655425024.htm" title="内核调试环境：buildroot/debootstrap制作文件系统、编译内核、QEMU模拟" target="_blank">内核调试环境：buildroot/debootstrap制作文件系统、编译内核、QEMU模拟</a> 苏打呀 <a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a><a class="tag" taget="_blank" href="/search/qemu/1.htm">qemu</a><a class="tag" taget="_blank" href="/search/kernel/1.htm">kernel</a> <div>编译内核#安装常用工具和依赖，可能会多，懒得分了，全装了吧反正以后说不定还要用。。。sudoaptinstallcurlwgetgpgzshtreegitnet-toolsproxychains4remminavimtarstracellvmclangunzipgccgcc-multilibbuild-essentialflexbisoncmakemakegawkdkmsautoconfninja</div> </li> <li><a href="/article/1903754955320258560.htm" title="代码随想录day7-链表俩数相加" target="_blank">代码随想录day7-链表俩数相加</a> 凌凡天 <a class="tag" taget="_blank" href="/search/%E9%93%BE%E8%A1%A8/1.htm">链表</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E7%BB%93%E6%9E%84/1.htm">数据结构</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E7%AE%97%E6%B3%95/1.htm">算法</a><a class="tag" taget="_blank" href="/search/leetcode/1.htm">leetcode</a> <div>给你两个非空的链表，表示两个非负的整数。它们每位数字都是按照逆序的方式存储的，并且每个节点只能存储一位数字。请你将两个数相加，并以相同形式返回一个表示和的链表。你可以假设除了数字0之外，这两个数都不会以0开头。示例1：输入：l1=[2,4,3],l2=[5,6,4]输出：[7,0,8]解释：342+465=807.示例2：输入：l1=[0],l2=[0]输出：[0]示例3：输入：l1=[9,9,9</div> </li> <li><a href="/article/1903753561662091264.htm" title="HTML实现酷炫3D相册" target="_blank">HTML实现酷炫3D相册</a> 算法与编程之美 <a class="tag" taget="_blank" href="/search/%E7%BC%96%E7%A8%8B%E4%B9%8B%E7%BE%8E/1.htm">编程之美</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/js/1.htm">js</a><a class="tag" taget="_blank" href="/search/css3/1.htm">css3</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a> <div>欢迎点击「算法与编程之美」↑关注我们！本文首发于微信公众号："算法与编程之美"，欢迎关注，及时了解更多此系列文章。欢迎加入团队圈子！与作者面对面！直接点击！目录1、创建文件目录2、调背景色3、制作3D相册4、将图片散开，围成一圈。5、绘制透明底盘6、最终效果1、创建文件目录在Hbuilder在新建一个目录，创建css和js文件。图12、调背景色在style块里面给整个页面渲染成黑色调。*{padd</div> </li> <li><a href="/article/1903752929085550592.htm" title="A Software as a Service (SaaS)" target="_blank">A Software as a Service (SaaS)</a> W_X_99515681 <a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E7%BB%93%E6%9E%84/1.htm">数据结构</a> <div>IntroductionThisfinalprojectisacomprehensiveassignmentdesignedtoassessyourmasteryofwebdevelopmentconceptscoveredthroughoutthecourse.Itisasignificantundertakingthatwillrequiresubstantialtimeanddedicati</div> </li> <li><a href="/article/98.htm" title="微信开发者验证接口开发" target="_blank">微信开发者验证接口开发</a> 362217990 <a class="tag" taget="_blank" href="/search/%E5%BE%AE%E4%BF%A1+%E5%BC%80%E5%8F%91%E8%80%85+token+%E9%AA%8C%E8%AF%81/1.htm">微信开发者 token 验证</a> <div>微信开发者接口验证。 Token，自己随便定义，与微信填写一致就可以了。根据微信接入指南描述 http://mp.weixin.qq.com/wiki/17/2d4265491f12608cd170a95559800f2d.html 第一步：填写服务器配置第二步：验证服务器地址的有效性第三步：依据接口文档实现业务逻辑这里主要讲第二步验证服务器有效性。建一个</div> </li> <li><a href="/article/225.htm" title="一个小编程题-类似约瑟夫环问题" target="_blank">一个小编程题-类似约瑟夫环问题</a> BrokenDreams <a class="tag" taget="_blank" href="/search/%E7%BC%96%E7%A8%8B/1.htm">编程</a> <div> 今天群友出了一题：一个数列,把第一个元素删除,然后把第二个元素放到数列的最后,依次操作下去,直到把数列中所有的数都删除,要求依次打印出这个过程中删除的数。 &</div> </li> <li><a href="/article/352.htm" title="linux复习笔记之bash shell (5) 关于减号-的作用" target="_blank">linux复习笔记之bash shell (5) 关于减号-的作用</a> eksliang <a class="tag" taget="_blank" href="/search/linux%E5%85%B3%E4%BA%8E%E5%87%8F%E5%8F%B7%E2%80%9C-%E2%80%9D%E7%9A%84%E5%90%AB%E4%B9%89/1.htm">linux关于减号“-”的含义</a><a class="tag" taget="_blank" href="/search/linux%E5%85%B3%E4%BA%8E%E5%87%8F%E5%8F%B7%E2%80%9C-%E2%80%9D%E7%9A%84%E7%94%A8%E9%80%94/1.htm">linux关于减号“-”的用途</a><a class="tag" taget="_blank" href="/search/linux%E5%85%B3%E4%BA%8E%E2%80%9C-%E2%80%9D%E7%9A%84%E5%90%AB%E4%B9%89/1.htm">linux关于“-”的含义</a><a class="tag" taget="_blank" href="/search/linux%E5%85%B3%E4%BA%8E%E5%87%8F%E5%8F%B7%E7%9A%84%E5%90%AB%E4%B9%89/1.htm">linux关于减号的含义</a> <div> 转载请出自出处： http://eksliang.iteye.com/blog/2105677 管道命令在bash的连续处理程序中是相当重要的，尤其在使用到前一个命令的studout（标准输出）作为这次的stdin（标准输入）时，就显得太重要了，某些命令需要用到文件名，例如上篇文档的的切割命令（split）、还有</div> </li> <li><a href="/article/479.htm" title="Unix(3)" target="_blank">Unix(3)</a> 18289753290 <a class="tag" taget="_blank" href="/search/unix+ksh/1.htm">unix ksh</a> <div>1)若该变量需要在其他子进程执行，则可用"$变量名称"或${变量}累加内容什么是子进程？在我目前这个shell情况下，去打开一个新的shell，新的那个shell就是子进程。一般状态下，父进程的自定义变量是无法在子进程内使用的，但通过export将变量变成环境变量后就能够在子进程里面应用了。 2)条件判断： &&代表and ||代表or&nbs</div> </li> <li><a href="/article/606.htm" title="关于ListView中性能优化中图片加载问题" target="_blank">关于ListView中性能优化中图片加载问题</a> 酷的飞上天空 <a class="tag" taget="_blank" href="/search/ListView/1.htm">ListView</a> <div>ListView的性能优化网上很多信息，但是涉及到异步加载图片问题就会出现问题。具体参看上篇文章http://314858770.iteye.com/admin/blogs/1217594 如果每次都重新inflate一个新的View出来肯定会造成性能损失严重，可能会出现listview滚动是很卡的情况，还会出现内存溢出。现在想出一个方法就是每次都添加一个标识，然后设置图</div> </li> <li><a href="/article/733.htm" title="德国总理默多克：给国人的一堂“震撼教育”课" target="_blank">德国总理默多克：给国人的一堂“震撼教育”课</a> 永夜-极光 <a class="tag" taget="_blank" href="/search/%E6%95%99%E8%82%B2/1.htm">教育</a> <div>http://bbs.voc.com.cn/topic-2443617-1-1.html德国总理默多克：给国人的一堂“震撼教育”课　安吉拉—默克尔，一位经历过社会主义的东德人，她利用自己的博客，发表一番来华前的谈话，该说的话，都在上面说了，全世界想看想传播——去看看默克尔总理的博客吧！　　德国总理默克尔以她的低调、朴素、谦和、平易近人等品格给国人留下了深刻印象。她以实际行动为中国人上了一堂</div> </li> <li><a href="/article/860.htm" title="关于Java继承的一个小问题。。。" target="_blank">关于Java继承的一个小问题。。。</a> 随便小屋 <a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div>今天看Java 编程思想的时候遇见一个问题，运行的结果和自己想想的完全不一样。先把代码贴出来！ //CanFight接口 interface Canfight { void fight(); } //ActionCharacter类 class ActionCharacter { public void fight() { System.out.pr</div> </li> <li><a href="/article/987.htm" title="23种基本的设计模式" target="_blank">23种基本的设计模式</a> aijuans <a class="tag" taget="_blank" href="/search/%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F/1.htm">设计模式</a> <div>Abstract Factory：提供一个创建一系列相关或相互依赖对象的接口，而无需指定它们具体的类。　　Adapter：将一个类的接口转换成客户希望的另外一个接口。A d a p t e r模式使得原本由于接口不兼容而不能一起工作的那些类可以一起工作。　　Bridge：将抽象部分与它的实现部分分离，使它们都可以独立地变化。　　Builder：将一个复杂对象的构建与它的表示分离，使得同</div> </li> <li><a href="/article/1114.htm" title="《周鸿祎自述：我的互联网方法论》读书笔记" target="_blank">《周鸿祎自述：我的互联网方法论》读书笔记</a> aoyouzi <a class="tag" taget="_blank" href="/search/%E8%AF%BB%E4%B9%A6%E7%AC%94%E8%AE%B0/1.htm">读书笔记</a> <div>从用户的角度来看,能解决问题的产品才是好产品,能方便/快速地解决问题的产品,就是一流产品. 商业模式不是赚钱模式一款产品免费获得海量用户后,它的边际成本趋于0,然后再通过广告或者增值服务的方式赚钱,实际上就是创造了新的价值链. 商业模式的基础是用户,木有用户,任何商业模式都是浮云.商业模式的核心是产品,本质是通过产品为用户创造价值. 商业模式还包括寻找需求</div> </li> <li><a href="/article/1241.htm" title="JavaScript动态改变样式访问技术" target="_blank">JavaScript动态改变样式访问技术</a> 百合不是茶 <a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a><a class="tag" taget="_blank" href="/search/style%E5%B1%9E%E6%80%A7/1.htm">style属性</a><a class="tag" taget="_blank" href="/search/ClassName%E5%B1%9E%E6%80%A7/1.htm">ClassName属性</a> <div> 一:style属性格式: HTML元素.style.样式属性="值"; 创建菜单:在html标签中创建或者在head标签中用数组创建 <html> <head> <title>style改变样式</title> </head> &l</div> </li> <li><a href="/article/1368.htm" title="jQuery的deferred对象详解" target="_blank">jQuery的deferred对象详解</a> bijian1013 <a class="tag" taget="_blank" href="/search/jquery/1.htm">jquery</a><a class="tag" taget="_blank" href="/search/deferred%E5%AF%B9%E8%B1%A1/1.htm">deferred对象</a> <div> jQuery的开发速度很快，几乎每半年一个大版本，每两个月一个小版本。每个版本都会引入一些新功能，从jQuery 1.5.0版本开始引入的一个新功能----deferred对象。 &nb</div> </li> <li><a href="/article/1495.htm" title="淘宝开放平台TOP" target="_blank">淘宝开放平台TOP</a> Bill_chen <a class="tag" taget="_blank" href="/search/C%2B%2B/1.htm">C++</a><a class="tag" taget="_blank" href="/search/c/1.htm">c</a><a class="tag" taget="_blank" href="/search/%E7%89%A9%E6%B5%81/1.htm">物流</a><a class="tag" taget="_blank" href="/search/C%23/1.htm">C#</a> <div>淘宝网开放平台首页：http://open.taobao.com/ 淘宝开放平台是淘宝TOP团队的产品，TOP即TaoBao Open Platform，是淘宝合作伙伴开发、发布、交易其服务的平台。支撑TOP的三条主线为： 1.开放数据和业务流程 * 以API数据形式开放商品、交易、物流等业务； &</div> </li> <li><a href="/article/1622.htm" title="【大型网站架构一】大型网站架构概述" target="_blank">【大型网站架构一】大型网站架构概述</a> bit1129 <a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%AB%99%E6%9E%B6%E6%9E%84/1.htm">网站架构</a> <div>大型互联网特点面对海量用户、海量数据大型互联网架构的关键指标高并发高性能高可用高可扩展性线性伸缩性安全性大型互联网技术要点前端优化 CDN缓存反向代理 KV缓存消息系统分布式存储 NoSQL数据库搜索监控安全想到的问题： 1.对于订单系统这种事务型系统，如</div> </li> <li><a href="/article/1749.htm" title="eclipse插件hibernate tools安装" target="_blank">eclipse插件hibernate tools安装</a> 白糖_ <a class="tag" taget="_blank" href="/search/Hibernate/1.htm">Hibernate</a> <div> eclipse helios(3.6)版 1.启动eclipse 2.选择 Help > Install New Software...> 3.添加如下地址： http://download.jboss.org/jbosstools/updates/stable/helios/ 4.选择性安装：hibernate tools在All Jboss tool</div> </li> <li><a href="/article/1876.htm" title="Jquery easyui Form表单提交注意事项" target="_blank">Jquery easyui Form表单提交注意事项</a> bozch <a class="tag" taget="_blank" href="/search/jquery+easyui/1.htm">jquery easyui</a> <div>jquery easyui对表单的提交进行了封装，提交的方式采用的是ajax的方式，在开发的时候应该注意的事项如下： 1、在定义form标签的时候，要将method属性设置成post或者get，特别是进行大字段的文本信息提交的时候，要将method设置成post方式提交，否则页面会抛出跨域访问等异常。所以这个要</div> </li> <li><a href="/article/2003.htm" title="Trie tree(字典树)的Java实现及其应用-统计以某字符串为前缀的单词的数量" target="_blank">Trie tree(字典树)的Java实现及其应用-统计以某字符串为前缀的单词的数量</a> bylijinnan <a class="tag" taget="_blank" href="/search/java%E5%AE%9E%E7%8E%B0/1.htm">java实现</a> <div> import java.util.LinkedList; public class CaseInsensitiveTrie { /** 字典树的Java实现。实现了插入、查询以及深度优先遍历。 Trie tree's java implementation.(Insert,Search,DFS) Problem Description Igna</div> </li> <li><a href="/article/2130.htm" title="html css 鼠标形状样式汇总" target="_blank">html css 鼠标形状样式汇总</a> chenbowen00 <a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a> <div>css鼠标手型cursor中hand与pointer Example：CSS鼠标手型效果 <a href="#" style="cursor:hand">CSS鼠标手型效果</a> Example：CSS鼠标手型效果 <a href="#" style=&qu</div> </li> <li><a href="/article/2257.htm" title="[IT与投资]IT投资的几个原则" target="_blank">[IT与投资]IT投资的几个原则</a> comsci <a class="tag" taget="_blank" href="/search/it/1.htm">it</a> <div> 无论是想在电商,软件,硬件还是互联网领域投资,都需要大量资金,虽然各个国家政府在媒体上都给予大家承诺,既要让市场的流动性宽松,又要保持经济的高速增长....但是,事实上,整个市场和社会对于真正的资金投入是非常渴望的,也就是说,表面上看起来,市场很活跃,但是投入的资金并不是很充足的...... </div> </li> <li><a href="/article/2384.htm" title="oracle with语句详解" target="_blank">oracle with语句详解</a> daizj <a class="tag" taget="_blank" href="/search/oracle/1.htm">oracle</a><a class="tag" taget="_blank" href="/search/with/1.htm">with</a><a class="tag" taget="_blank" href="/search/with+as/1.htm">with as</a> <div>oracle with语句详解转在oracle中，select 查询语句，可以使用with,就是一个子查询，oracle 会把子查询的结果放到临时表中，可以反复使用例子:注意，这是sql语句，不是pl/sql语句，可以直接放到jdbc执行的 ----------------------------------------------------------------</div> </li> <li><a href="/article/2511.htm" title="hbase的简单操作" target="_blank">hbase的简单操作</a> deng520159 <a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E5%BA%93/1.htm">数据库</a><a class="tag" taget="_blank" href="/search/hbase/1.htm">hbase</a> <div>近期公司用hbase来存储日志,然后再来分析 ,把hbase开发经常要用的命令找了出来. 用ssh登陆安装hbase那台linux后用hbase shell进行hbase命令控制台! 表的管理 1）查看有哪些表 hbase(main)> list 2）创建表 # 语法：create <table>, {NAME => <family&g</div> </li> <li><a href="/article/2638.htm" title="C语言scanf继续学习、算术运算符学习和逻辑运算符" target="_blank">C语言scanf继续学习、算术运算符学习和逻辑运算符</a> dcj3sjt126com <a class="tag" taget="_blank" href="/search/c/1.htm">c</a> <div>/* 2013年3月11日20:37:32 地点：北京潘家园功能：完成用户格式化输入多个值目的：学习scanf函数的使用 */ # include <stdio.h> int main(void) { int i, j, k; printf("please input three number:\n"); //提示用</div> </li> <li><a href="/article/2765.htm" title="2015越来越好" target="_blank">2015越来越好</a> dcj3sjt126com <a class="tag" taget="_blank" href="/search/%E6%AD%8C%E6%9B%B2/1.htm">歌曲</a> <div>越来越好房子大了电话小了感觉越来越好假期多了收入高了工作越来越好商品精了价格活了心情越来越好天更蓝了水更清了环境越来越好活得有奔头人会步步高想做到你要努力去做到幸福的笑容天天挂眉梢越来越好婆媳和了家庭暖了生活越来越好孩子高了懂事多了学习越来越好朋友多了心相通了大家越来越好道路宽了心气顺了日子越来越好活的有精神人就不显</div> </li> <li><a href="/article/2892.htm" title="java.sql.SQLException: Value '0000-00-00' can not be represented as java.sql.Tim" target="_blank">java.sql.SQLException: Value '0000-00-00' can not be represented as java.sql.Tim</a> feiteyizu <a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a> <div>数据表中有记录的time字段（属性为timestamp）其值为：“0000-00-00 00:00:00” 程序使用select 语句从中取数据时出现以下异常： java.sql.SQLException:Value '0000-00-00' can not be represented as java.sql.Date java.sql.SQLException: Valu</div> </li> <li><a href="/article/3019.htm" title="Ehcache（07）——Ehcache对并发的支持" target="_blank">Ehcache（07）——Ehcache对并发的支持</a> 234390216 <a class="tag" taget="_blank" href="/search/%E5%B9%B6%E5%8F%91/1.htm">并发</a><a class="tag" taget="_blank" href="/search/ehcache/1.htm">ehcache</a><a class="tag" taget="_blank" href="/search/%E9%94%81/1.htm">锁</a><a class="tag" taget="_blank" href="/search/ReadLock/1.htm">ReadLock</a><a class="tag" taget="_blank" href="/search/WriteLock/1.htm">WriteLock</a> <div>Ehcache对并发的支持在高并发的情况下，使用Ehcache缓存时，由于并发的读与写，我们读的数据有可能是错误的，我们写的数据也有可能意外的被覆盖。所幸的是Ehcache为我们提供了针对于缓存元素Key的Read（读）、Write（写）锁。当一个线程获取了某一Key的Read锁之后，其它线程获取针对于同</div> </li> <li><a href="/article/3146.htm" title="mysql中blob,text字段的合成索引" target="_blank">mysql中blob,text字段的合成索引</a> jackyrong <a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a> <div> 在mysql中，原来有一个叫合成索引的，可以提高blob,text字段的效率性能，但只能用在精确查询，核心是增加一个列，然后可以用md5进行散列，用散列值查找则速度快比如： create table abc(id varchar(10),context blog,hash_value varchar(40)); insert into abc(1,rep</div> </li> <li><a href="/article/3273.htm" title="逻辑运算与移位运算" target="_blank">逻辑运算与移位运算</a> latty <a class="tag" taget="_blank" href="/search/%E4%BD%8D%E8%BF%90%E7%AE%97/1.htm">位运算</a><a class="tag" taget="_blank" href="/search/%E9%80%BB%E8%BE%91%E8%BF%90%E7%AE%97/1.htm">逻辑运算</a> <div>源码：正数的补码与原码相同例+7 源码：00000111 补码：00000111 （用8位二进制表示一个数）负数的补码：符号位为1，其余位为该数绝对值的原码按位取反；然后整个数加1。 -7 源码： 10000111 ，其绝对值为00000111 取反加一：11111001 为-7补码已知一个数的补码，求原码的操作分两种情况：</div> </li> <li><a href="/article/3400.htm" title="利用XSD 验证XML文件" target="_blank">利用XSD 验证XML文件</a> newerdragon <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/xml/1.htm">xml</a><a class="tag" taget="_blank" href="/search/xsd/1.htm">xsd</a> <div>XSD文件（XML Schema 语言也称作 XML Schema 定义（XML Schema Definition，XSD）。具体使用方法和定义请参看： http://www.w3school.com.cn/schema/index.asp java自jdk1.5以上新增了SchemaFactory类可以实现对XSD验证的支持，使用起来也很方便。以下代码可用在J</div> </li> <li><a href="/article/3527.htm" title="搭建 CentOS 6 服务器(12) - Samba" target="_blank">搭建 CentOS 6 服务器(12) - Samba</a> rensanning <a class="tag" taget="_blank" href="/search/centos/1.htm">centos</a> <div>（1）安装 # yum -y install samba Installed: samba.i686 0:3.6.9-169.el6_5 # pdbedit -a rensn new password:123456 retype new password:123456 …… （2）Home文件夹 # mkdir /etc</div> </li> <li><a href="/article/3654.htm" title="Learn Nodejs 01" target="_blank">Learn Nodejs 01</a> toknowme <a class="tag" taget="_blank" href="/search/nodejs/1.htm">nodejs</a> <div>（1）下载nodejs https://nodejs.org/download/ 选择相应的版本进行下载（2）安装nodejs 安装的方式比较多，请baidu下我这边下载的是“node-v0.12.7-linux-x64.tar.gz”这个版本（1）上传服务器（2）解压 tar -zxvf node-v0.12.</div> </li> <li><a href="/article/3781.htm" title="jquery控制自动刷新的代码举例" target="_blank">jquery控制自动刷新的代码举例</a> xp9802 <a class="tag" taget="_blank" href="/search/jquery/1.htm">jquery</a> <div>1、html内容部分复制代码代码示例: <div id='log_reload'> <select name="id_s" size="1"> <option value='2'>-2s-</option> <option value='3'>-3s-</option</div> </li> </ul> </div> </div> </div> <div> <div class="container"> <div class="indexes"> 按字母分类： <a href="/tags/A/1.htm" target="_blank">A</a><a href="/tags/B/1.htm" target="_blank">B</a><a href="/tags/C/1.htm" target="_blank">C</a><a href="/tags/D/1.htm" target="_blank">D</a><a href="/tags/E/1.htm" target="_blank">E</a><a href="/tags/F/1.htm" target="_blank">F</a><a href="/tags/G/1.htm" target="_blank">G</a><a href="/tags/H/1.htm" target="_blank">H</a><a href="/tags/I/1.htm" target="_blank">I</a><a href="/tags/J/1.htm" target="_blank">J</a><a href="/tags/K/1.htm" target="_blank">K</a><a href="/tags/L/1.htm" target="_blank">L</a><a href="/tags/M/1.htm" target="_blank">M</a><a href="/tags/N/1.htm" target="_blank">N</a><a href="/tags/O/1.htm" target="_blank">O</a><a href="/tags/P/1.htm" target="_blank">P</a><a href="/tags/Q/1.htm" target="_blank">Q</a><a href="/tags/R/1.htm" target="_blank">R</a><a href="/tags/S/1.htm" target="_blank">S</a><a href="/tags/T/1.htm" target="_blank">T</a><a href="/tags/U/1.htm" target="_blank">U</a><a href="/tags/V/1.htm" target="_blank">V</a><a href="/tags/W/1.htm" target="_blank">W</a><a href="/tags/X/1.htm" target="_blank">X</a><a href="/tags/Y/1.htm" target="_blank">Y</a><a href="/tags/Z/1.htm" target="_blank">Z</a><a href="/tags/0/1.htm" target="_blank">其他</a> </div> </div> </div> <footer id="footer" class="mb30 mt30"> <div class="container"> <div class="footBglm"> <a target="_blank" href="/">首页</a> - <a target="_blank" href="/custom/about.htm">关于我们</a> - <a target="_blank" href="/search/Java/1.htm">站内搜索</a> - <a target="_blank" href="/sitemap.txt">Sitemap</a> - <a target="_blank" href="/custom/delete.htm">侵权投诉</a> </div> <div class="copyright">版权所有 IT知识库 CopyRight © 2000-2050 E-COM-NET.COM , All Rights Reserved.  </div> </div> </footer>  <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shCore.js"></script> <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shLegacy.js"></script> <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shAutoloader.js"></script> <link type="text/css" rel="stylesheet" href="/static/syntaxhighlighter/styles/shCoreDefault.css"/> <script type="text/javascript" src="/static/syntaxhighlighter/src/my_start_1.js"></script> </body> </html>