小编Cra*_*oiD的帖子

我正在尝试使用angularjs进行验证表格,到目前为止我做得很好.但是当我提交我的重置按钮时,所有字段都会重置,除了我从验证部分获得的错误消息.当我重置表单时,如何摆脱所有字段和错误消息.

按下我的重置按钮时就是这样

这是我的代码

<div class="page-header"><center><h2>Give us your Feedback</h2></center></div>

    <!-- pass in the variable if our form is valid or invalid -->
    <form name="userForm" ng-submit="submitForm(userForm.$valid)" novalidate>

        <!-- NAME -->
        <div class="form-group" ng-class="{ 'has-error' : userForm.name.$invalid && !userForm.name.$dirty }">
            <label>Name*</label>
            <input type="text" name="name" class="item-input-wrapper form-control" ng-model="user.name"  required>
            <p ng-show="userForm.name.$invalid && !userForm.name.$pristine " class="help-block">
                <font color="#009ACD">You name is required.</font>
            </p>
        </div>

         <!-- EMAIL -->
        <div class="form-group" ng-class="{ 'has-error' : userForm.email.$invalid && !userForm.email.$dirty  }">
            <label>Email</label>
            <input type="email" name="email" class="item-input-wrapper form-control" ng-model="user.email" required >
            <p …

嗨,我是新来的反应,我无法理解数据绑定如何在reactjs中工作.我在AngularJS中完成了数据绑定,但在reactjs中它似乎更复杂.

我想要做的是当我在输入字段中键入一些文本时,它应该实时出现在另一个地方.

这是我的意见

<div className="post_input">

    <input className='post_data_input_overlay' placeholder="Ask your question here" ref="postTxt"/>

</div>

所以当我在这个输入字段中输入一些内容时,它应该出现在其他地方.我怎么能这样做？

我需要在Ionic中创建一个表.我想过使用离子网格却无法实现我想要的效果.我怎样才能做到这一点？这是一个类似于我想要的东西的图像:

我可以使用这个但是如何划分图片中的行？

<div class="list">

  <div class="item item-divider">
    Candy Bars
  </div>

  <a class="item" href="#">
    Butterfinger
  </a>

  ...

</div>

我正在努力学习反应,我有一些不确定性.我正在引用反应DOCS和其他一些教程,我看到函数写在渲染函数内部,也在类内部.我们应该在渲染函数内做什么反应？

第一路

class App extends Component {

    test(user) {

        return user.firstName;
    }

    render() {

        const user = {
            firstName: 'Harper',
            lastName: 'Perez'
        };

        return (

            <div>

                <h1>{this.test(user)}</h1>

            </div>
        )
    }
}

第二种方式

class App extends Component {

       render() {

        const user = {
            firstName: 'Harper',
            lastName: 'Perez'
        };

        function test(user) {

            return user.firstName;
        }

        return (

            <div>

                <h1>{test(user)}</h1>

            </div>

        )

    }
}

这两种方法都有效.但我想知道这样做的最佳方法是什么？最重要的是,我想知道我在渲染功能中可以做什么样的事情.

谢谢.

我已经为我的android应用程序实现了一个弹出菜单.我已经为弹出菜单创建了一个xml,代码也可以正常工作.现在我无法弄清楚如何处理弹出菜单项单击.我尝试过使用PopupMenu.OnMenuItemClickListener,但没有成功.我怎样才能做到这一点？

我的弹出菜单代码

ImageButton button = (ImageButton) view.findViewById(R.id.popUp_song);

            button.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {


                    PopupMenu popup = new PopupMenu(activity, v);
                    Menu m = popup.getMenu();
                    MenuInflater inflater = popup.getMenuInflater();
                    inflater.inflate(R.menu.song_popup, popup.getMenu());

                    if (audio.getDownload().equals("0")) {

                        m.removeItem(R.id.add_download);

                    }

                    popup.show();
                }


            });

XML

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
    style="@style/ToolBarStyle">

    <item
        android:id="@+id/add_queue"
        android:title="Add to queue" />
    <item
        android:id="@+id/play_next"
        android:title="Add to favourite" />
    <item
        android:id="@+id/add_download"
        android:title="Download" />


</menu>

我在我的android应用程序中添加了一个mapview.我在清单中使用了正确的设置,现在我遇到了问题.当我去我有地图的地方时,它只显示画布而不显示地图.如果我触摸它只开始加载.即使这样它也没有完全加载.它只加载到一定的水平.如果我继续触摸屏幕,它会不断加载.但即使这样我也无法放大或缩小,甚至无法移动地图.这有解决方案吗？我做错了什么吗？

我的守则

            MapView mapView;
            GoogleMap map;





             mapView = (MapView)view.findViewById(R.id.map);
             Bundle savedInstanceState = null;
            mapView.onCreate(savedInstanceState);

                // Gets to GoogleMap from the MapView and does initialization stuff
                map = mapView.getMap();
                map.getUiSettings().setMyLocationButtonEnabled(false);
                map.setMyLocationEnabled(true);

                MapsInitializer.initialize(activity);

                double lat;
                double lon;

                lat = Double.parseDouble(theaterDetail.getLatitude());
                lon = Double.parseDouble(theaterDetail.getLongitude());

                // Updates the location and zoom of the MapView
                map.addMarker(new MarkerOptions().position(
                        new LatLng(lat, lon)).title(theaterDetail.getAddress()));

                final LatLng THEATER_POSITION = new LatLng(lat, lon);

                CameraPosition cameraPosition = new CameraPosition.Builder()
                        .target(THEATER_POSITION) // Sets the center of the map to
                                                    // THEATER_POSITION
                        .zoom(10) // …

当第一行没有更多空间时，我试图将多余的文本移到新行。但是我的文本只是继续填充同一行而不移动到另一行。我怎样才能解决这个问题？我想在第一行填充文本时移到下一行。

我已经试过了

word-wrap: break-word

white-space: initial;

但没有效果。

我的代码如下：

<form onSubmit={ handleSubmit }>
   <div className="create_post_div unchange_div">
        <Field
            name="askQuestionInput"
            component="input"
            type="text"
            className="post_input_preview unchange_div"
            placeholder="Ask your question here"
        />
    </div>
</form>

我的CSS类：

.create_post_div{

    width: 100%;
    margin-top: 10px;
    margin-bottom: 10px;
    padding: 10px;
}

.post_input_preview {

    width: 640px;
    border: none;
    margin-bottom: 10px;
    font-size: 16px;
    outline: none;
}

提前致谢。

我有一个组件，在该组件中定义了一个onClick方法。在该方法上，我正在调用后端并得到一些响应。仅在刷新浏览器后才设置从后端调用获取的值。有没有办法通过刷新浏览器来重新渲染我的组件？

我使用了this.forceUpdate()反应文档中的内容，但无法实现我所需要的。如何在不刷新浏览器的情况下仅重新渲染我的组件？

我的代码。

handleClick(id) {

    this.setState({

        vote_status: !this.state.vote_status,

    })

    let vote_object = {
        voting_object: id,
        post_id: this.props.postId
    }
    this.props.submitvote(vote_object)

    //this.forceUpdate()
}

render() {

    console.log("getVoteStatus", this.props.getVoteStatus)

    let {contents, submitvote, postId, voted_id} = this.props

    return (

        <div className="txt_vote_bar_div" style={{
            color: voted_id === contents.post_poll_content_id ? 'white' : '#9da0a4',
            backgroundColor: this.state.vote_status ? '#0b97c4' : '#FFFFFF'
        }} id={contents.post_poll_content_id}>
            <p className="txt_vote_choice"
               style={{color: this.state.vote_status || voted_id === contents.post_poll_content_id ? '#FFFFFF' : '#6a6a6a'}}
               id={"id" + contents.post_poll_content_id}
               onClick={() => {
                   this.handleClick(contents.post_poll_content_id);

               }}> {contents.content} </p>
            <p …

我不断得到允许需要循环，但可能会导致未初始化的值。考虑重构以消除对循环的需要。在我的终端上发出警告，它使调试我的程序变得如此困难。

我用过了

YellowBox.ignoreWarnings([
  'Require cycle:', 
])

并且

console.disableYellowBox = true;

但都没有奏效。YellowBox.ignoreWarnings 仅适用于移动设备上显示的警告，但不适用于我的 IDE 终端上的警告。如何防止在终端上收到这些警告。

我正在尝试在我的网络应用中显示从我的电脑中选择的图像.我提到了以下问题,该问题解决了我正在努力解决的问题.

如何显示所选图像而不将数据发送到服务器？

我有这样的html部分

 <div className="add_grp_image_div margin_bottom">
      <img src={img_upload} className="add_grp_image"/>
      <input type="file" className="filetype" id="group_image"/>
      <span className="small_font to_middle">Add group image</span>
      <img id="target"/>
 </div>

我想在中显示所选图像

<img id="target"/>

我怎样才能做到这一点？

我也提到了FileReader文档.

https://developer.mozilla.org/en-US/docs/Web/API/FileReader