我希望当我点击按钮时,我可以获得特定的img src并在div类img-block块中显示img src .
HTML
<button class="button">Click</button>
<div class="img1">
<img src="img.jpg" alt="">
</div>
<div class="img-block"></div>
CSS
.img-block{
position: absolute;
top:10%;
right:10%;
background-color: red;
width: 500px;
height: 500px;
}
.img1 img{
width: 200px;
}
JS
$('.button').click(function(){
var images = $('.img1 img').attr(src);
alert(images);
});
但现在我面临的问题是获得img src.
所以我使用警报进行测试,结果是它什么都没提醒.
在React v16.2.0 中，有一个新的 API 调用React.Children。
我很好奇React.Children和children直接使用有什么不同。
例如，如果我想操纵子内容，我可以在这两种方法中都做到这一点。例子
const Child = () => (
<div>child</div>
)
class App extends React.Component {
render() {
const template1 = React.Children.map(this.props.children, (child) => {
return React.cloneElement(child);
});
const template2 = this.props.children.map((child) => {
return React.cloneElement(child);
});
return [template1, template2];
}
}
结果是一样的。
有谁知道有什么不同？
或者react团队发布这个API的目的是什么。
谢谢你。
我想将我的react组件打包为umdlib.
下面是webpack我的设置:
module.exports = {
devtool: 'eval',
entry: [
'./lib/index'
],
output: {
path: path.join(__dirname, 'dist'),
filename: 'lib.js',
library: 'lib',
libraryTarget: 'umd'
},
resolve: {
extensions: ['', '.js']
},
module: {
loaders: [
{
test: /\.js$/,
loaders: ['babel'],
exclude: /node_modules/
}
]
},
externals: {
"react": "React"
}
}
之后我以这种方式在我的其他组件中需要包
example.js
import React, {Component} from 'react';
import ReactDOM from 'react-dom';
import {lib} from "../dist/lib";
以上组件的webpack设置是:
module.exports = {
devtool: 'eval',
entry: [
'./examples/example'
],
output: {
path: path.join(__dirname, …当我创建一个npm包时,有时它会面临向后旧的依赖包版本的需要.
如果新版本有新的api,我可以用这种模式编写代码:
import pkg from 'some-pkg';
const isNewVersion = pkg.newVersionApi !== 'undefined';
if (isNewversion) {
pkg.newVersionApi();
} else {
pkg.oldVersionApi(); // backward compatible api
}
有了这种模式,当我想编写测试时,我只能测试installed version代码.其他版本的代码无法测试.
例如,在React v15和v16中,React v16具有新的API Portal.在Portal发布之前,v15有unstable_renderSubtreeIntoContainerapi实现类似的功能.
所以React的代码就像:
import ReactDOM from 'react-dom';
const isV16 = ReactDOM.createPortal !== 'undefined';
if (isV16) {
ReactDOM.createPortal(...);
} else {
ReactDOM.unstable_renderSubtreeIntoContainer(...);
}
所以我想问一下有什么方法可以测试different dependency version吗？
目前,我想到的一种方法是再次安装另一个版本并进行测试.但它只能在当地做.它不能在ci上工作,它不能统计在一起.
我认为这不仅仅是反应测试.它可能面向node.js测试.任何建议都可以讨论.
更新
这个问题可能与two versions dependency在npm中安装有关.但我知道目前安装两个版本依赖是不可行的.
在我当前的代码中，我使用process.cwd()获取当前工作目录，然后加载一些文件（如配置文件）。
下面我将展示我的代码的概念以及我如何测试它。
这是目录结构：
??? index.js
??? test
??? index.test.js
??? config.js
索引.js
const readRootConfig = function() {
const dir = process.cwd();
console.log(dir); // show the working dir
const config = require(`${dir}/config.js`);
}
然后我用 jest 来测试这个文件。
index.test.js
import readRootConfig '../index';
it('test config', () => {
readRootConfig();
})
运行测试后，consoledir是./（实际输出的是绝对路径，我在这个demo中只显示了相对路径）
但我希望 dir 的输出是./test.
是否有任何配置可以让 jest 使用test file folder该process.cwd()文件夹？
我认为解决方案之一是dir path作为参数传递，例如：
索引.js
const readRootConfig = function(dir) {
console.log(dir); // show …我写了一个日历代码,但是我有一些错误.这是我的代码:
#include<iostream>
#include<iomanip>
using namespace std;
int main(){
int month, year, Y, M;
int day[13]={0,31,28,31,30,31,30,31,31,30,31,30,31};
int FirstDayofMonth;
cout<<"please enter year!"<<endl;
cin>>year;
while(year<1600)
{
cout<<"please do not enter year less than 1600!"<<endl;
cin>>year;
}
cout<<"please enter month! (1~12)"<<endl;
cin>>month;
Y = year – (14 – month)/12;
M = month + 12 * ((14 - month) / 12) - 2;
FirstDayofMonth = (Y+Y/4-Y/100+Y/400+31*M/12+1)%7;
}
其他部分是打印结果.它显示了下面的错误
try.cpp:18: error: stray ‘\342’ in program
try.cpp:18: error: stray ‘\200’ in program
try.cpp:18: error: stray ‘\223’ in …