Module: React::FunctionComponent::API

Defined in:
lib/react/function_component/api.rb

Instance Attribute Summary collapse

Instance Method Summary collapse

Instance Attribute Details

#props ⇒ Object

Returns the value of attribute props.



4
5
6
 
# File 'lib/react/function_component/api.rb', line 4

def props
  @props
end

Instance Method Details

#initialize(props) ⇒ Object 



6
7
8
 
# File 'lib/react/function_component/api.rb', line 6

def initialize(props)
  @props = ::React::Component::Props.new(`{props: props}`)
end

#use_callback(deps, &block) ⇒ Object 



10
11
12
 
# File 'lib/react/function_component/api.rb', line 10

def use_callback(deps, &block)
  `Opal.global.React.useCallback(function() { #{block.call} }, deps)`
end

#use_context(context) ⇒ Object 



14
15
16
17
 
# File 'lib/react/function_component/api.rb', line 14

def use_context(context)
  `(typeof context.$is_wrapped_context !== 'undefined')` ? context.to_n : context
  `Opal.global.React.useContext(native_context)`
end

#use_debug_value(value) ⇒ Object 



19
20
21
 
# File 'lib/react/function_component/api.rb', line 19

def use_debug_value(value)
  `Opal.global.React.useDebugValue(value)`
end

#use_effect(&block) ⇒ Object 



23
24
25
 
# File 'lib/react/function_component/api.rb', line 23

def use_effect(&block)
  `Opal.global.React.useEffect(function() { #{block.call} })`
end

#use_imperative_handle(ref, *deps, &block) ⇒ Object 



27
28
29
30
 
# File 'lib/react/function_component/api.rb', line 27

def use_imperative_handle(ref, *deps, &block)
  native_ref = `(typeof ref.$is_wrapped_ref !== 'undefined')` ? ref.to_n : ref
  `Opal.global.React.useImperativeHandle(native_ref, function() { #{block.call} }, deps)`
end

#use_layout_effect(&block) ⇒ Object 



32
33
34
 
# File 'lib/react/function_component/api.rb', line 32

def use_layout_effect(&block)
  `Opal.global.React.useLayoutEffect(function() { #{block.call} })`
end

#use_memo(*deps, &block) ⇒ Object 



36
37
38
 
# File 'lib/react/function_component/api.rb', line 36

def use_memo(*deps, &block)
  `Opal.global.React.useMemo(function() { #{block.call} }, deps)`
end

#use_reducer(inital_state, &block) ⇒ Object 



40
41
42
43
44
45
46
47
48
49
 
# File 'lib/react/function_component/api.rb', line 40

def use_reducer(inital_state, &block)
  state = nil
  dispatcher = nil
  %x{
    [state, dispatcher] = Opal.global.React.useReducer(function(state, action) {
      #{block.call(state, action)}
    }, initial_state);
  }
  [state, proc { |arg| `dispatcher(arg)` }]
end

#use_ref(initial_value) ⇒ Object 



51
52
53
 
# File 'lib/react/function_component/api.rb', line 51

def use_ref(initial_value)
  React::Ref.new(`Opal.global.React.useRef(initial_value)`)
end

#use_state(initial_value) ⇒ Object 



55
56
57
58
59
60
 
# File 'lib/react/function_component/api.rb', line 55

def use_state(initial_value)
  initial = nil
  setter = nil
  `[initial, setter] = Opal.global.React.useState(initial_value);`
  [initial, proc { |arg| `setter(arg)` }]
end