質問編集履歴

1

書式の改善

2018/06/13 16:11

投稿

Kiparisv3
Kiparisv3

スコア6

test CHANGED
@@ -1 +1 @@
1
- Popoverの表示位置をマウスの座標を参照するようにしたい
1
+ Popoverの表示位置をマウスの座標に応じて変更したい
test CHANGED
@@ -2,15 +2,21 @@
2
2
 
3
3
 
4
4
 
5
- Reactstrapを使用しているのですが、ボタンをクリックしたのポップオーバーが出る位置を、ボタンの位置を参照するのはなく、マウスの位置を参照ることは可能でしょうか?
5
+ ボタンをクリックした際、マウス下にポップオーバーが開くようにしたいです
6
+
7
+
8
+
9
+ Reactstrapを使用しています。
6
10
 
7
11
  Bootstrapでの実装方法でも構いませんので、ご教授願いたいです。
8
12
 
9
13
 
10
14
 
11
- ### 該当のソースコード
15
+ ### サンプルコード
12
16
 
13
17
 
18
+
19
+ ```Javascript
14
20
 
15
21
  import React, {Component} from 'react'
16
22
 
@@ -20,7 +26,7 @@
20
26
 
21
27
  class Example extends Component{
22
28
 
23
- constructor(props) {
29
+ constructor(props) {
24
30
 
25
31
  super(props);
26
32
 
@@ -56,11 +62,7 @@
56
62
 
57
63
  <Row className="mt-100">
58
64
 
59
- <Button id="Popover1" onClick={this.toggle}>
65
+ <Button id="Popover1" onClick={this.toggle}>Launch Popover</Button>   //クリックするとボタンの下にPopoverが出る
60
-
61
- Launch Popover
62
-
63
- </Button>
64
66
 
65
67
  <Popover placement="bottom" isOpen={this.state.popoverOpen} target="Popover1" toggle={this.toggle}>
66
68
 
@@ -84,6 +86,10 @@
84
86
 
85
87
  export default Example
86
88
 
89
+ ```
90
+
91
+
92
+
87
93
 
88
94
 
89
95